CSS Forum

**BigJohnny** · 08-17-2008, 06:58 PM

I cant seem to figure this out, Im trying to make a table, but i cant get two divs to sit side by side.

**wayfarer07** · 08-17-2008, 07:13 PM

HTML Code:

<style>
#div1 {
width: 100px;
float: left;
}
#div2 {
width: 100px;
float: left;
}
.clear {
clear: both;
}
</style>
<body>
<div id="div1">
</div>
<div id="div2">
 </div>
<br class="clear" />
</body>

**BigJohnny** · 08-17-2008, 07:47 PM

that worked, but im so lost with what im trying to do.

I want to basically turn this table, into divs, with a nice thin 1px border separating everything..... even this table is messed up, but its at least laid out how i want it to look.

Code:

#DLTable {
width : 593px; 
height: auto;
} 
#DLTable TR {
background-color : #c2ceda; 
}
#DLTable TD {
list-style-type: none;
font-size : 10px; 
color : #000000; 
font-family : Ms Sans Serif, Times New Roman; 
border: 1px solid #000000;
}

Code:

<table id="DLTable" cellspacing="0" cellpadding="0">

    <tr>
        <td height="60" rowspan="3">
        </td>
        <td height="20" width="17%">Name</td>
        <td height="20" width="61%">&nbsp;</td>
    </tr>
    <tr>
        <td height="20" width="17%">Size</td>
        <td height="20" width="61%">&nbsp;</td>
    </tr>
    <tr>
        <td height="20" width="17%">Download</td>
        <td height="20" width="61%">&nbsp;</td>
    </tr>
    <tr>
        <td colspan="3" height="75">&nbsp;</td>
    </tr>
    
</table>

**BigJohnny** · 08-17-2008, 07:53 PM

oh this is what ive got for my divs...

Code:

#DTable {
    width: 593px;
    height: 110px;
    border: 1px solid #000000;
    border-top: none;
}
.DIcon {
    width: 60px;
    height: 60px;
    float: left;
    border: 1px solid #000000;
}
.DInfo {
    width: 529px;
    height: 60px;
    border: 1px solid #000000;
    border-right: none;
    border-left: none;
    float: left;
}
.DInfo LI {
    padding-right : 0; 
    padding-left : 0; 
    padding-bottom : 0; 
    margin : 0; 
    padding-top : 0; 
    height: 18px;
    list-style-type : none; 
    background-color : #c2ceda; 
    font-size : 12px; 
    color : #ffffff; 
    font-family : Ms Sans Serif, Times New Roman; 
    text-decoration : none; 
}

Code:

<div id="DTable">
    <div class="DIcon">

    </div>
    <div class="DInfo">
        <li>test</li>
        <li>test</li>
        <li>test</li>
    </div>
</div>

**LadynRed** · 08:05 PM

Quote:

That is incorrect, you have to wrap the list inside the <ul></ul> declaring it as an unordered list. So it would be:

[quote]<div class="DInfo">
<ul>
<li>test</li>
<li>test</li>
<li>test</li>
</ul>
</div>

**BigJohnny** · 08-17-2008, 08:35 PM

it still isnt coming out right, and i just cannot seem to figure out how to make it look like the other table.

www.u3programs.com is where the page is currently located.