Forum Moderators: not2easy

Message Too Old, No Replies

Div Container Problem when window size changes

         

dicky18

4:59 am on Sep 27, 2007 (gmt 0)

10+ Year Member



I am having a problem with container I have menus and tables inside these containers one on the left and one on the right but when the window is restored down all menus go out of the container
and looks ugly.

Is there a way to keep the div containers same size even when the window size is changed
Thanks in advance.

Marshall

6:40 am on Sep 27, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



You will need to post relevant CSS and HTML to help solve the problem.

Marshall

dicky18

7:07 am on Sep 27, 2007 (gmt 0)

10+ Year Member



Thanks for your reply
Css for sidebar 1 & 2 and Main Content in Between:
.thrColLiqHdr #sidebar1 {
float: left;
width: 22%;
background: #EBEBEB;
padding: 15px 0;
}
.thrColLiqHdr #mainContent {
width: 400px;
margin-top: 20px;
margin-right: 25%;
margin-bottom: 0;
margin-left: 23%;
}

.thrColLiqHdr #sidebar2 {
float: right;
width: 23%;
background: #EBEBEB;
padding: 15px 0;
}
.thrColLiqHdr #sidebar1 p, .thrColLiqHdr #sidebar1 h3, .thrColLiqHdr #sidebar2 p, .thrColLiqHdr #sidebar2 h3 {
margin-left: 10px;
margin-right: 10px;
}
.thrColLiqHdr #mainContent {
margin: 0 24% 0 23.5%;
}

MENUS & TABLES(HTML)for example this is a table in sidebar 2 when I change the window size (restore down) in IE this table will go out and the text in the main content will go to below the sidebars :
<table width="175" border="1" bordercolor="#996633" bgcolor="#999999">
<tr bordercolor="#CCCCCC" bgcolor="#666666">
<th scope="col"><span class="style3 style8">Contact Us</span></th>
</tr>
<tr bordercolor="#996600" bgcolor="#EBEBEB">
<th scope="col"><a href="skype:hygeia.healthcare?call"><img src="http://mystatus.skype.com/smallclassic/hygeia%2Ehealthcare" style="border: none;" width="114" height="20" alt="My status" /></a>
<p>
<script type="text/javascript" src="javascript/skypeCheck.js"></script>
<img src="images/Phone_40.gif" alt="Get a Quote" name="Quote" width="18" height="14" id="Quote" /><span class="style7 style12">Call us + 66 26775662</span></p></th>
</tr>
<tr bordercolor="#996600" bgcolor="#EBEBEB">
<th scope="col"><div align="left"><span class="style2"><a href="contactus.html"><br/>
<img src="images/doc01.gif" alt="Get a Quote" name="Quote" width="20" height="20" border="0" id="Quote2" /></a><a href="contactus.html" class="nav">Click here for FREE Evaluation and a list of the Prices.</a></span><br/>
<br/>
</div></th>
</tr>
<tr bordercolor="#CCCCCC" bgcolor="#666666">
<th scope="col"><span class="style3 style8">Ask The Doctor</span> </th>
</tr>
<tr bgcolor="#d2bf99">
<form action="http://www.liposuctionthailand.com/tectiteform.php" method="post" name="AsktheDoctor" id="AsktheDoctor">
<p>
<input type="hidden" name="env_report2" value="REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT,AUTH_TYPE,REMOTE_USER" />
<input type="hidden" name="recipients2" value="info8RXF54hygeiahealthcare.com" />
<input type="hidden" name="required2" value="name:Name,email1:E-mail"/>
<input type="hidden" name="derive_fields2" value="date = %moy0%.%'-'%.%dom0%.%'-'%.%year%" />
<input type="hidden" name="subject2" value="Ask The Doctor [Liposuction Thailand]" />
<input type="hidden" name="good_url2" value="http://www.liposuctionthailand.com" />
</p>
<td bgcolor="#EBEBEB"><div align="center">
<p><br/>
<span class="style4">Name</span>
<input name="name" type="text" value="Name" id="name" onfocus="clearTextBox(this, 'Name');" onblur="revertTextBox(this, 'Name');"/>
<span class="style4">Email</span>
<input name="email2" type="text" id="email" value="Email" onfocus="clearTextBox(this, 'Email');" onblur="revertTextBox(this, 'Email');"/>
<span class="style4">Question</span>
<textarea name="question" id="question" onfocus="clearTextBox(this, 'Comments / Questions');" onblur="revertTextBox(this, 'Comments / Questions');">Comments / Questions</textarea>
</p>
<p align="center">
<input type="submit" name="Submit" value="Submit" />
</p>
</div></td>
</form>
</tr>
</table>