CSS & Stuff

Hai dar,

Basically, I have some php:

Show Hide

PHP Code:

---

            while ( $conversation_object = mysql_fetch_object( $select_conversation ) )
            {
                
                // spacing
                echo( "<br />" );
                //
                // header/subject
                echo( "<div class='subject'>" . $conversation_object->subject . " : " . $conversation_object->date . "</div>" );
                //
                // sidebar/picture/motto
                $profile_mysql = mysql_query( "SELECT * FROM `user` WHERE `username` = '$conversation_object->poster'" );
                $profile_picture = mysql_fetch_object( $profile_mysql );
                echo( "<div class='sidebar'>" . $conversation_object->poster . "<br /><img src='" . $profile_picture->picture . "'></img>
                     <br /><br />
                     " . $profile_picture->motto . "</div>" );
                //
                // main post
                echo( "<div class='main'>" . $conversation_object->message . "</div>" );
                //
                // footer
                echo( "<div class='footer'></div>" );
                //
                // spacing
                echo( "<br /><br />" );
                // 
                
            } 


---

The CSS is:

Show Hide

Code:

---

.subject {
        padding: 5px 10px;
        background-color: #666;
}

.sidebar {
        float: left;
        width: 134px;
        padding: 10px;
        background-color: #999;
}

.main {
        float: right;
        width: 392px;
        padding: 10px;
        background-color: #CCC;
}

.footer {
        float: clear both;
        width: 526px;
        padding: 10px;
}

---

However, the output I get is like this:
http://habtown.net/pedmore/?part=show_messages

Which sucks, because the main content and sidebar don't always reach the bottom.

Any idea how I'd go about making the sidebar & main content area reach the footer at all times? Otherwise it just looks messy and they aren't the same size.

Thanks a bunch!
sidenote#: this is happening on google chrome & firefox for sure, not sure about other browsers.

I don't know how to mix PHP with CSS, but I'm not sure about the:
float: clear both; ?

Is that even a code, or have you made it up? :P

Clear: both; is correct?

What is the message/news systelm your useing?

Quote:

---

Originally Posted by Meti

I don't know how to mix PHP with CSS, but I'm not sure about the:
float: clear both; ?

Is that even a code, or have you made it up? :P

Clear: both; is correct?

---

Oh my god! I'm an idiot, clearly.
I'm presuming it isn't code, it sounds a bit dodgy. :P

Well I'll try that quickly and edit this post, thanks a bunch.

Quote:

---

What is the message/news systelm your useing?

---

My own.

Edit: Clearing both seems to cause a big white space :(. Hmm, any ideas how I could make it join on without spacing in between plus reach the footer on both columns?
Edit2: Meti, the HTML code would be:

HTML Code:

---

<div class="subject">Hello : Boo</div>
<div class="sidebar">
My name:
<br />
<img src=''></img>
<br /><br />
Some tag line.
</div>
<div class="main">Message thingy</div>
<div class="footer">Footer</div>
<br /><br />

---

I believe.

Sorry for double post, can't edit.
New CSS:

Code:

---

#subject {
        padding: 5px 10px;
        margin: auto;
        border: 1px solid gray;
        background-color: #FFF;
}

#sidebar {
        float: left;
        width: 133px;
        padding: 10px;
        margin: auto;
        border-left: 1px solid gray;
        background-color: #FFF;
}

#main {
        float: right;
        width: 390px;
        padding: 10px;
        margin: auto;
        border-right: 1px solid gray;
        border-left: 1px solid gray;
        background-color: #FFF;
}

#footer {
        clear: both;
        width: 546px;
        padding: 10px;
        border: 1px solid gray;
        margin: auto;
}

---

Still, the #main doesn't reach the footer. :(