# Need help with my css and div order

**URL:** <https://forum.kirupa.com/t/need-help-with-my-css-and-div-order/256302>\
**Category:** Uncategorized\
**Created:** [April 1, 2008, 7:44pm UTC](https://forum.kirupa.com/t/need-help-with-my-css-and-div-order/256302 "2008-04-01T19:44:55Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Navarone](https://avatars.discourse-cdn.com/v4/letter/n/f9ae1b/32.png) [@Navarone](https://forum.kirupa.com/u/Navarone)\
**Post date:** [April 1, 2008, 7:44pm UTC](https://forum.kirupa.com/t/need-help-with-my-css-and-div-order/256302/1 "2008-04-01T19:44:55Z")

</div>

I have a problem that I can’t resolve I have container and ul list which will contain links. At the end of each link will be an image arrow. I can’t see to get the image arrow to display at the end of the text in the list. Sometimes I can get it to display correctly in IE7 by changing the position of the link\_arrow to absolute, but FF pukes on it.

So I starte off my container css like so

```auto

/*from the stylesheet */
.nav_container {
 position: absolute; 
 top:305px;
 left:0px;
 background-image: url('../images/new_career_images/nav_background.jpg'); 
 width: 572px;
 height: 395px;
 margin: 0px 0px 0px 0px; /*top-right-bottom-left*/ 
 padding: 0px 0px 0px 0px;
}
.nav_container ul {
 list-style-type: none; 
 margin: 5px 0px 0px 13px; /*top-right-bottom-left*/
 padding: 0px 0px 0px 0px; 
}
.nav_container li { 
 position: relative;  
 margin: 0px 0px 0px 0px; /*top-right-bottom-left*/
 padding: 0px 0px 0px 0px;  
}
.link_arrow { 
 position: relative;   
 background-image: url('../images/new_career_images/arrow.jpg');
 background-repeat: no-repeat; 
 width: 8px;
 height: 9px;
 margin: 3px 0px 0px 5px; /*top-right-bottom-left*/ 
 padding: 0px 0px 0px 0px; 
}
.nav_container #searchJobs { 
 font-family: Arial;
 font-size: 11px; 
 color: #2c2976;
 margin: 53px 0px 0px 67px; /*top-right-bottom-left*/ 
 padding: 0px 0px 0px 0px; 
 /*background-color: gray;*/
 width: 200px;
}

```

and my page code is thus

```auto

<div class="nav_container">
    <div id="searchJobs">
     <ul>
      <li>Browse Open Jobs & Apply Online<div class="link_arrow"></div></li>
      <li>Search Open Jobs & Apply Online<div class="link_arrow"></div></li>
      <li>View Application Status<div class="link_arrow"></div></li>
      <li>Create a Profile for Future Jobs<div class="link_arrow"></div></li>
      <li>Edit Your Profile<div class="link_arrow"></div></li>
      <li>Hiring Process<div class="link_arrow"></div></li>
     </ul>
    </div>
   </div>

```

link to my web page [http://dev-westfield.virtualhorizons.com/careers/work\_westfield.jsp](http://dev-westfield.virtualhorizons.com/careers/work_westfield.jsp)

Any help appreciated.:sigh: