Image appearing in the wrong place.
Posted
by
Luke
on Stack Overflow
See other posts from Stack Overflow
or by Luke
Published on 2010-12-31T16:43:13Z
Indexed on
2010/12/31
16:54 UTC
Read the original article
Hit count: 288
I have a list that I want to precede on each line with a small image.
The CSS:
.left div.arrow{background-image: url(../images/design/box.png); float:left; height:15px; width:15px; margin-right:2px;}
.left a.list:link, a:visited, a:active {color:black; font-size:0.8em; text-decoration:none; display:block; float:left;}
The HTML:
<div class="panel">My quick links</div>
<div class="arrow"></div>
<a href="/messages.php?p=new" class="list">Send a new message</a>
<br />
<div class="arrow"></div>
<a href="/settings.php#password" class="list">Change my password</a>
<br />
<div class="arrow"></div>
<a href="/settings.php#picture" class="list">Upload a new site image</a>
<br />
As you can see, each image should go before the writing. On the first line, the text "Send a new message" has the preceeding image. However, each line afterwards has the image at the end. So "Send a new message" has an image at the start and finish.
It is like the images are staying at the end of the previous line. Any ideas?
© Stack Overflow or respective owner
