abazoskib Posted September 22, 2009 Share Posted September 22, 2009 I have a problem with my main div and the fieldset I have encompassing a table. Here's a screenshot: hxxp://all-inbox.com/images/screenie.png When the table gets too wide, I want the div to stay with it, however it does not. Here's the CSS: #statTable { margin-left: 0px; padding: 3px; margin-top: 0px; border: 0px solid #000; min-width: 750px; /*height: 250px;*/ font-family: Arial; } #dashedDiv { text-align: left; vertical-align: middle; margin: 0px auto; padding: 10px; /*min-width: 1000px;*/ min-height: 500px; width: 100%; background-color: #ffffff; border: 1px dashed #564b47; } fieldset { width: 800px; margin-left: 10px; margin-bottom: 20px; padding: 0px; border-style: solid; border-width: 1px; border-color: #659539; background-color: #ffffff; min-height: 250px; } legend { padding: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #000; background: #fff; font-weight: bold; } Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/ Share on other sites More sharing options...
saltedm8 Posted September 22, 2009 Share Posted September 22, 2009 can you post the html too please.. what would be ideal would be a link to a live page Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923139 Share on other sites More sharing options...
abazoskib Posted September 22, 2009 Author Share Posted September 22, 2009 <fieldset> <legend><b>Statistics - Overview</b></legend> <table summary="StatisticalOverviewTable" id="statTable" style="font-family: Arial;"> <tr> ..... </tr> </table></fieldset> Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923152 Share on other sites More sharing options...
saltedm8 Posted September 22, 2009 Share Posted September 22, 2009 sorry, I did mean the html for the whole page, and all the css... as I need to be able to see the div and the rest of it to see if anything else is causing the issue Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923178 Share on other sites More sharing options...
abazoskib Posted September 22, 2009 Author Share Posted September 22, 2009 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <meta name="robots" content="noindex" /> <link rel="stylesheet" type="text/css" href="media/style.css" /> <link rel="stylesheet" type="text/css" href="media/menu.css" /> <script type="text/javascript" src="media/script.js"></script> <link rel="stylesheet" type="text/css" href="media/balloontip.css" /> <script type="text/javascript" src="media/balloontip.js"> </script> <title>xxxxx</title> </head> <body> <div class="left"><a href="index.php"><img src="media/xxxxx.gif" alt="xxxxxxx" class="image" /></a></div> <div id="dashedDiv"> <script type="text/javascript"> setTimeout('extendSession( "d21e422e_c4de_44a4_8590_6e22bcc87d2b")', 10763000); </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Untitled document</title> </head> <body> </body> </html><div class="right">Welcome back, xxxxxxxxxx.<br/><br/><a href="logout.php">Logout</a> | <a href="preferences.php">Preferences</a></div><fieldset> <legend><b>Statistics - Overview</b></legend> <table summary="StatisticalOverviewTable" id="statTable" style="font-family: Arial;"> <tr valign="top" class="headTR" style="font-size: 10px"> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> <td>xxxx</td> </tr> <form method="post" name="PSGPTML4861090922" id="PSGPTML4861090922" action="statistics.php"><tr valign=top><style>.textfield_effect2 { text-align: right;}</style></form></table></fieldset> </div> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta name="robots" content="noindex" /> <title>Untitled document</title> </head> <body> <div id="footer">xxxxxxxxxxxxxxxxxxx</div> </body> </html><script type="text/javascript"> var menu=new menu.dd("menu"); menu.init("menu","menuhover"); </script> </body> </html> the extra <html> and <body> tags are the crappy GoDaddy html editors adding their own tags when I use include to put a menu on the page. Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923198 Share on other sites More sharing options...
haku Posted September 23, 2009 Share Posted September 23, 2009 Explicitly set the width of the table to 100% and see if that helps. Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923274 Share on other sites More sharing options...
abazoskib Posted September 23, 2009 Author Share Posted September 23, 2009 yes! that worked ... care to explain? Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-923322 Share on other sites More sharing options...
haku Posted September 25, 2009 Share Posted September 25, 2009 To be honest, I'm not exactly sure of the full reasoning behind it - it's just something I've found to work in the past. But what I think that happens is that the natural width of the table takes precedence over the width of the containing element. So you need to explicitly set the width of the table at 100% so that it doesn't overlap. Quote Link to comment https://forums.phpfreaks.com/topic/175153-fieldset-overlapping-div/#findComment-924542 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.