6 svar · 608 visningar · startad av saw
Så här ser det ut:
Jag har först en liten bild(med en pil på) därefter kommer en länk (detta
upprepar sig sju ggr).
Problemet är att jag inte kan få länken i gämnhöjd med pilen.
<div style=" margin-top:0; text-align:left; font-size:12px; font-weight:bold;
vertical-align: top;" ><img src="bilder/pilen.gif" alt="" /><a href="index.aspx?
index=1">Hemservice</a></div>
Se bifogad bild.
Tacksam för hjälp.
Det är alltid lite meck med att få till det där.
I ditt fall har jag använt en ul / li lista för menyn:
<ul>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
</ul>
Och sen använt list-style-item eller list-style-image för att få med pilen.
Mer info finns här: http://www.devguru.com/Technologies/css/quickref/css_liststyleimage.html
Tack för svar det är ju en bit på vägen men jag kan inte ladda bilden ifrån css
ul.out { list-style-position: outside;
list-style-image: url("bilder/pilen.gif"); }
Det brukar alltid tetas för mig det...
Du ska nog inte ha URL:en inom citationstecken tror jag. Men du kan lika gärna prova sätta in bilden i a-taggen, t.ex.:
a {
padding-left:15px;
background: url (bilder/pilen.gif) left middle;}
a:hover {
background: url(bilder/pilen2.gif) left middle;}
typ....
"left" är bildens horisontella placering, "middle" är dess vertikala placering (du kan testa top och bottom också).
Nej jag får ingen bild med mig, annars så ser det ju snyggt ut.
Det är vanligt att man missförstår egenskapen "vertical-align".
Någon annan sitter säkert på en bra förklaring för hur det fungerar, men här är en snabblänk jag hittade:
http://phrogz.net/CSS/vertical-align/index.html
Du kan använda din ursprungliga kod men behöver bara ändra en detalj:
<div style=" margin-top:0; text-align:left; font-size:12px; font-weight:bold;" ><img src="bilder/pilen.gif" alt="" style="vertical-align: middle;" /><a href="index.aspx?
index=1">Hemservice</a></div>
Detta tackar jag för, det blev kanonbra.