# Help! Floating a \<dl\>

**URL:** https://forum.kirupa.com/t/help-floating-a-dl/219542
**Category:** Uncategorized
**Created:** [March 17, 2007, 5:22pm UTC](https://forum.kirupa.com/t/help-floating-a-dl/219542 "2007-03-17T17:22:27Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![joshtilton](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/joshtilton/32/2064_2.png) [@joshtilton](https://forum.kirupa.com/u/joshtilton)
#### Post date: [March 17, 2007, 5:22pm UTC](https://forum.kirupa.com/t/help-floating-a-dl/219542/1 "2007-03-17T17:22:27Z")

</div>

Hi! I need some help correctly laying out some element on my website.

Currently I have everything functioning using different divs. I know that using a detailed list would actually be the correct way of doing this. I am just having a pain trying to figure out how to do it. Here is what i am trying to achieve :[http://www.joshtilton.com/websites.jpg](http://www.joshtilton.com/websites.jpg)

This is currently the code i am using within a \<div\> wrapper :

```auto

<div id="level1"> 
<div id= "one"><img src="webcontentimages/swthumb.jpg" /><span class="style2">SERVICES:</span> Logo, site design, and Flash. 
  <p> <dt class="view-site"><a href="images/sw.jpg" rel="lightbox[sites]" title="Salisbury Woodworks website">image #1</a></dt></div> 

<div id= "two"> 
  <div class="twocnt"><img src="webcontentimages/hsthumb.jpg" /><span class="style2">SERVICES:</span> Logo, 
photography, site 
design, 
    <p> <img src="webcontentimages/viewbtn.jpg" /></div> 
</div> 
<div id= "three"><img src="webcontentimages/v2thumb.jpg" /><span class="style2">SERVICES:</span> Flash, 
gallery, design 
and html. 
  <p> <img src="webcontentimages/viewbtn.jpg" /></div>  

```

and for the css:

```auto

div#one{ 

float:left; 
width:137px; 
height: 300px; 
} 

div#two{ 
float : left; 
width:265px; 
height: 300px; 
} 

div#three{ 
float : right; 
width:137px; 
height: 300px; 
} 

.view-site a { 
display: block; 
text-indent: -9999px; 
width: 137px; 
height: 20px; 
border: 0;  
background: url(webcontentimages/viewbtn.jpg) no-repeat; }  

```

I’m still a newb at this and im doing what i can with what I know. I know that the above code works (only in firefox and safari, forget IE6 and 7) If anyone can help me out, please do so!
