PDA

View Full Version : why wont this code sit in its parent div



forcerhpool
Feb 8th, 2010, 10:00 PM
the following code wont sit in it's parent div, it's a list of latest forum threads that should go into the content div but when i float it's contents to the left it jumps out of the box.

any idea why? i originally had a fieldset which wouldn't float so i've removed it and changed it to a div but it's having the same problem.



<div class="main-box-container">
<div class="header"><a href="/forum/search.php?do=getnew"><b>Latest Forum Threads!</b></a></div>
<div class="content"><?
mysql_select_db("site");
$result = mysql_query("SELECT * FROM homepage_rss") or die(mysql_error());
while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {
foreach ($line as $col_value) {

$x++;

if ($x == 1) { $id = $col_value; }
if ($x == 2) { $name = $col_value; }
if ($x == 3) { $fid = $col_value; }
if ($x == 4) { $numthreads = $col_value; }
if ($x == 5) { $titlelength = $col_value; }

}

echo "<div style=\"width:24%; float:left; padding:2px; text-align:left;\"><p>$name</p>";
echo "<script src=\"http://www.ultimatebuzz.net/forum/external.php?type=js&forumids=$fid\" type=\"text/javascript\"></script>";
echo '<script type="text/javascript">var max = '.$numthreads.'; if(threads.length < max) max = threads.length; for(i = 0; i < max; i++) { if (threads[i].title.length > '.$titlelength.') { threads[i].title = threads[i].title.substring(0, '.$titlelength.') + \'..\'; } document.writeln("&nbsp;<img src=\"../images/menu_arrow.gif\"><a href=\"http://www.ultimatebuzz.net/forum/showthread.php?t=" + threads[i].threadid + "\">" + threads[i].title + "</a><br />"); } </script>';
echo "</div>";
$x = 0;
}
?></div>
</div>

drhowarddrfine
Feb 8th, 2010, 10:29 PM
Parent elements are never to expand to contain floated children because floated elements are removed from the normal flow.

To get parent elements to do so, you need to "clear float". One way is to add 'overflow:auto' so the div expands when elements 'overflow'.

ahallicks
Feb 9th, 2010, 12:44 PM
Or you can use overflow:hidden; instead of auto if you do not want scrollbars to appear. This is also another method of clearing floats