|
HTML - A Way To Keep The Table A Fixed Height? Need Help With Site Layout
Hi there,
I have a table layout on the main page of site I'm working on, and have one row with two cells. The cell on the left contains a php include page which auto updates with news, however, as the news gets longer and the cell container auto resizes to fit the height..it also messes with the height of the cell on the right, leaving empty spaces (the black space right under "recruitment status") I'm stumped as to how to deal with is, any suggestions are much appreciated. Thanks the site: http://guild-paragon.com/indexframe edit: decided to put an iframe in there to hold the height, there's prob better alternatives out there though Similar TutorialsHi There, I have included my code below. The table looks correct in Firefox 2 and Safari 3 but not IE7. I am attempting to create a table that fills up the entire page with a fixed width row at the bottom. IE7 ignores the height I have set for the second row and makes both rows the same height. Note that the Doctype tag is important here, if I remove it then the page looks correct, however it is my intention to ensure the browser runs in standards mode. As far as I am aware my code is correct. Any help or advice would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
html,body{
margin:0;
padding:0;
height:100%;
border:none;
}
</style>
</head>
<table height="100%" cellpadding="0" cellspacing="0" border="1" width="100%">
<tr>
<td>
Line 1
</td>
</tr>
<tr style="height:10px;">
<td>
Line 2
</td>
</tr>
</table>
</html>
The layout of this page I'm making requires a centered table, 800 pixels wide and 100% high. I am having huge problems making it fill the entire height of the page though, it just stops rather than going right to the bottom of the page. It's a 4.01 transistional compliant page if that's relevant. Here's a link to the page. Here's a link to the page (apologies for the file size) link to page I want the dark green center section, and the two side cells with tiled graphics to extend right down to the bottom of the page, regardless of height. The center table with the graphics can stay where it is or vertically center, I don't mind about that. I also need it to have no vertical scrollbar when it's viewed fullscreen. If I remove the doctype, it works fine, but I'm wondering if there's a way to have it vaild for that doctype and still look ok? I've tried everything I can think of and am not turning up anything useful with web searches, if anyone can tell me where I've gone wrong and if this is possible to fix in html, I'd really appreciate it. I can't use CSS, and the doctype has to be as it is, because that's what the specs say (it's for an html class). Thanks for any help. Hi, I have a template in the making but i have got to a point now where the footer isnt working. I want the footer to stick to the bottom of the browser and for it to work when there is a small amount of content which doesnt require scrolling and also when scrolling is required. At the moment it works when scrolling isnt required but as you will see on my example below when scrolling happens the footer doesnt stay stuck to the bottom of the browser it just moves up with the rest of the site. Any ideas how to fix this? I have been testing in FF2 but i need it working in IE 6 + 7 + FF 2. The site is here any ideas or help would be great Cheers hello Every can any one tellme How can i make a webpage open in Fixed height and Width which is to be opened by a Hyperlink Example : like when you click On MORE link From The Smilies in this Forum it open a Small Window Resizeble Window I'm having so much trouble with this. I have a site (from photoshop) that will have have fluid layout (100% width) but I want the footer to "stick" to the bottom of the window (unless content goes longer). Here is content part of the html (which is a bit messed up now from trying many things) <div id=container> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr></tr> <tr> <td height="235" bgcolor="#FFFFFF"> </td> <td width="1000" rowspan="5" valign="top"><!-- ImageReady Slices (screencapture3.psd) --> <table width="1002" height="400" border="0" cellpadding="0" cellspacing="0" id="Table_01"> <tr> <td height="58" colspan="9"><img src="images/rightthere_01.jpg" width="417" height="58" alt="" /></td> <td colspan="10"><img src="images/screencapture2_01.jpg" width="583" height="58" alt="" /></td> </tr> <tr> <td colspan="9"><img src="images/rightthere_logo.jpg" alt="" width="417" height="76" border="0" /></td> <td colspan="3" rowspan="2"><img src="images/seniors.jpg" alt="" width="140" height="177" border="0" /></td> <td width="139" rowspan="2"><img src="images/caregivers.jpg" alt="" width="139" height="177" border="0" /></td> <td colspan="3" rowspan="2"><img src="images/physicians.jpg" alt="" width="142" height="177" border="0" /></td> <td colspan="3" rowspan="2"><img src="images/disabilities.jpg" alt="" width="162" height="177" border="0" align="top" /></td> </tr> <tr> <td height="101" colspan="9"><img src="images/inhome_tagline.jpg" alt="" width="417" height="101" border="0" /></td> </tr> <tr> <td colspan="19" bgcolor="#69781B"><img src="images/nav_top.jpg" width="1000" height="51" alt="" /></td> </tr> <div id:navigation></div> <td width="59"><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image44','','images/about_ro.jpg',1)"><img src="images/about.jpg" name="Image44" border="0" id="Image44" /></a></td> <td width="15"><img src="images/div1.jpg" width="15" height="17" alt="" /></td> <td width="144"><a href="why.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image45','','images/why_ro.jpg',1)"><img src="images/why.jpg" name="Image45" width="144" height="17" border="0" id="Image45" /></a></td> <td width="17"><img src="images/div2.jpg" width="17" height="17" alt="" /></td> <td width="114"><a href="what.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image46','','images/what.jpg',1)"><img src="images/what.jpg" name="Image46" width="114" height="17" border="0" id="Image46" /></a></td> <td width="17"><img src="images/div3.jpg" width="17" height="17" alt="" /></td> <td colspan="4" bgcolor="#8B9849"><a href="who.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image43','','images/who_ro.jpg',1)"><img src="images/who.jpg" name="Image43" width="127" height="17" border="0" id="Image43" /></a></td> <td width="16"><img src="images/div4.jpg" alt="" width="16" height="17" align="left" /></td> <td colspan="3"><a href="consider.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image47','','images/consider_ro.jpg',1)"><img src="images/consider.jpg" name="Image47" width="195" height="17" border="0" id="Image47" /></a></td> <td width="19"><img src="images/div5.jpg" width="19" height="17" alt="" /></td> <td colspan="2"><a href="careers.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image48','','images/careers_ro.jpg',1)"><img src="images/careers.jpg" name="Image48" width="188" height="17" border="0" id="Image48" /></a></td> <td width="19"><img src="images/div6.jpg" width="19" height="17" alt="" /></td> <td width="70"><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image49','','images/contact_ro.jpg',1)"><img src="images/contact.jpg" name="Image49" width="70" height="17" border="0" id="Image49" /></a></td> </tr> <tr> <td colspan="19" bgcolor="#6A791C"><img src="images/nav_bot.jpg" width="1000" height="42" alt="" /></td> </tr> <tr></tr> <tr> <td colspan="7"><div id=leftcontent> <h4>Left Content</h4> </div></td> <td width="4"> </td> <div id=maincontent> <td colspan="11"><h1>Main Content</h1></td> </div> </tr> <tr> <td><img src="images/spacer.gif" width="59" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="15" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="144" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="17" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="114" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="17" height="1" alt="" /></td> <td width="8"><img src="images/spacer.gif" width="8" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="1" height="1" alt="" /></td> <td width="42"><img src="images/spacer.gif" width="42" height="1" alt="" /></td> <td width="76"><img src="images/spacer.gif" width="76" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="16" height="1" alt="" /></td> <td width="48"><img src="images/spacer.gif" width="48" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="139" height="1" alt="" /></td> <td width="8"><img src="images/spacer.gif" width="8" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="19" height="1" alt="" /></td> <td width="115"><img src="images/spacer.gif" width="115" height="1" alt="" /></td> <td width="73"><img src="images/spacer.gif" width="73" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="19" height="1" alt="" /></td> <td><img src="images/spacer.gif" width="70" height="1" alt="" /></td> </tr> </table></td> </tr> <tr> <td height="110" bgcolor="#869343"> </td> <td height="110" bgcolor="#6A791C"> </td> </tr> <tr> <td> </td> <td> </td> </tr> </table> </tr> </div> <div id= "footer"> <td width="100%" height="79" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0"> <td width="0%" bgcolor="#859242"> </td> <td width="1000" bgcolor="#697819"><img src="images/footer.jpg" alt="" height="79" /></td> <td width="26%" bgcolor="#697819"> </td> </tr></table> </div></tr></tr></body> </html> and my css p { color: #6a6a6a; font-size: 15px; line-height: 20px; font-family: georgia, "Lucida Grande", Verdana, Arial ; top: 0; margin-top: 0; } h1 { color: #667824; font-size: 30px; font-family: verdana ; font-weight: bold; line-height: 30px; top: 0; margin-top: 0; } h4 { color: #4d4f53; font-size: 30px; font-family: verdana ; font-weight: bold; line-height: 30px; top: 0; margin-top: 0; } h2 { color: #667824; font-size: 20px; font-family: Arial, Verdana } h3 { color: #fff; font-size: 10px; font-family: "Lucida Grande", Verdana, Arial ; font-weight: normal; font-style: normal; } ul { color: #667824; font-weight: bold; font-size: 12px; font-family: verdana, Arial ; line-height: 14px; } h5 { color: #4d4f53; font-size: 10px; font-family: "Lucida Grande", Verdana, Arial ; font-weight: normal; font-style: normal; } A:link {text-decoration: none; color: 667824} A:visited {text-decoration: none; color: B71234} A:active {text-decoration: none} A:hover { color: B7CEC4; text-decoration: none; } html, body { margin:0; height: 100%; width: 100% } body >#container { margin:0; padding:0; height:auto; min-height:100%; position:relative; } #clearfooter {overflow:auto; padding-bottom: 79px;} #maincontent { float:left; min-width: 100px; } #leftcontent { min-width: 50px; } #left{ left: -1; right: 0; min-width: 100px; max-width: 200px; min-height: 235px; } #centerleft{ left: -1; right: 0; min-width: 172px; max-width: 200px; min-height:100px; } #right { position:relative;/*ie needs this to show float */ min-width:1px; max-width:200px; float:right; } #footer { width:100%; text-align:center; position:relative; margin:0; height:79px; clear:both; } #navigation { max-width: 1000px; vertical-align; top; text-align: left; } table { border-collapse: collapse; } please help. Hello, I need to create a 3 -column lay out with the left and right columns having 200px each and the middle column take the rest. Here is my html markup: HTML Code: <div style="width: 100%"> <div style="width: 200px; float:left;">Left column</div> <div style="width: 100%; float:left;">Middle Column</div> <div style="width: 200px; float:left;">Right Column</div> </div> It's not working for me . Please help. Hi all, i have table with 3 columns, this is the code: <body> <center><table frame="vsides" cellspacing="0" border="2" width="1000" cellpadding="10" > <tr> <td bgcolor="white" width="200" valign="top"> <br><br>This is some text. </td> <td bgcolor="white" width="600" valign="top"><br> This is some text. </td> <td bgcolor="white" width="200" valign="top"> <br> This is some text. </td> </tr> </table></center> </body> but when i enter some more txt table expand, is it possible to create table that columns can expand(height) but rows not(width)? thx Hi i have a table with a picture within its only cell . How can i lock the size of the table so that it wil not get any larger should a larger image be put in it? I have tried setting the width and height to a fixed value but that does not seem to do keep it fixed. Ideally i would like the image to resize itself to match the maximum values of the table but this i suppose will probably be a good bit harder? I will be brief in hoping that the issue does not require a thesis to properly fix. I'm dealing with tables within tables..within tables. In one instance, I have a 2x1 (row by column) table inside another table. So, we'll call the inside table "B" and the outside table "A". Table B is centered inside a column in Table A. I'm trying to maximize the space, but nearly nothing works. Setting Table B height=100% does nothing. The only thing that works is setting the height=N px, where N is a number. This is no good, as I want to the site to work on all resolutions. I want it to be proportional. How can I fix this? Here's what I'm dealing with, visually: Any help would be welcome. Thanks. Well i decided to come up with a new site layout. I took my site down, www.caspersmusicvideos.com, because personal issues and im ready to get it back up. Any ideas on how i should do this? One thing i know i want is a navbar that when you hover over like Music videos it has a drop down box with like a list of genreas you can view them by. ANy other ideas ....i suck at css so i might have to get someone to do that for me Hi, i'm doing an interface for a database, and i want to print my query results on tables. As i have many entries, i need a big table so i want to do a table with scroll where my header doesn't get out of sight (ever) when i scroll down. im working on NuSphere Phped, Windows 7. This code is working only on the PHPed simulator...on chrome and FF the scrollbar dont appear: PHP Code: <table align="center" cellpadding="3" cellspacing="0" style="border: black; border-style:double ; border-spacing: 0; cursor:default;"> <thead> <?php ###### ###### processing the query for($i=0; $i<$numcol; $i++) { ####### echo "<th bgcolor=\"#000000\" "; ####### some conditions for mouse events echo "><font face=\"helvetica, cursive\" size=\"-2\" color=\"white\">"; echo $column_name"</font></th>"; } ?> <th style="width: 16px; background: black;"></th> ##16px for the scrollbar </thead> <tbody style="overflow-y: scroll;overflow-x:hidden; height: 300;"> <?php $i=0; do{ ######## ######## ?> <tr onmouseover="this.bgColor='#B3BC7A'" onMouseout="this.bgColor='<?php if($i%2==0) echo "#eeeeee"; else echo "#ffffff"; ?>'" <?php if($i%2==0) echo " bgcolor=\"#eeeeee\" "; else echo " bgcolor=\"#ffffff\""; ?>> <?php for($j=0; $j<$numcol; $j++) { ?> <td <?php #######more php query precessing ########## ?> ><font face="helvetica, cursive" size="-2"> <?php } echo $attribute; ?> </td> <?php } ?> </font> <td style="width: 16px; overflow: scroll;"></td></tr> <?php $i++; }while($currentRow) ?> </tbody> </table> can someone tell me how to make it work on those browsers? Hi, I have the following problem i'm trying to solve with HTML: I have a simple table with 3 columns. I want the table to have a 100% width of the screen. Furthermore the center column must ALWAYS have a width of 1000. The left and right column should just be there too fill the gaps up if you have a wider screen than 1000. Setting these left/right columns to width "100%" doesn't work because than it would just make the left column fill up the space and the right column will have a width of 0. How can I solve this? Some example could would be highly appreciated Thanks, betonboor Hi, I'm a little new at this, and I'm trying to put a pretty simple website together. I have a table that is the basis for the whole website design. It's pretty fixed, so I want all the widths of the table to be constant. A couple rows have fixed heights for aesthetic purposes. A couple rows I want to expand to whatever height is necessary to accomodate the content inside. the fourth row of the table has three cells side by side that I use as the header design. 1) picture 2) space 3) title I want all these to have fixed widths and heights. underneath is a cell that spans the length of all three of those. This is where I want my content. 4) content The length of this stays fixed but the height changes as more content is addes. The trouble is, the table cells display correctly for me as long as there is limited amount of text inside the 4) content cell. Whenever I enter past a few sentences, the 1) picture cell starts taking up more of the width and shrinking the 3) title cell. And this really messes up the nice spacing I had. Any thoughts on why this would happen??? I'm just stuck. I've tried a million things, but I'm sure its something simple I can't see right now. Hopefully a pair of fresh (and knowledgeable) eyes can help! Thanks so much, heres my code: [font="Courier New"] <body> <table width="875" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="75" colspan="5"><img src="../images/RichfieldLogo.png" width="250" height="75"></td> </tr> <tr align="center"> <td height="25" colspan="5" valign="top" class="mainmenu" style="border-bottom: solid 1px #666666; border-top: solid 1px #666666"> <h1 class="menu"> <ul> <li><a href="#" class="mainmenu">Home</a></li> <li><a href="#" class="mainmenu">Party in the Park</a></li> <li><a href="#" class="mainmenu">Info</a></li> </ul> </h1></td> </tr> <tr> <td height="20" colspan="5"><img src="../images/20spacer.png" width="20" height="20"></td> </tr> <tr align="left" valign="top"> <td width="190" rowspan="2"> <img src="../images/PartynParkPlaceholder.png" width="190" height="385"></td> <td width="20" rowspan="2"><img src="../images/20spacer.png" width="20" height="20" border="0" align="top"></td> <!-- This is where the trouble starts! I can't get these cells to stay a fixed size!!! --> <td width="275" height="275"><img src="../images/SamplePicSmall1.png" width="275" height="275" border="0" align="right"></td> <td width="20" height="275"><img src="../images/20spacer.png" width="20" height="20"></td> <td width="370" height="275"> <p><font size="45px" face="Helvetica, Arial, sans-serif" weight="bold"><strong>Party <br /> in the Park</strong></font><br /> <h2 class="datetime"><font color="#666666">LOCATION </font> Richfield Park, 345 Main St in Richfield<br /> <font color="#666666">DATE </font>Saturday, October 13 2008 <br /> <font color="#666666">TIME</font> From 8am until late afternoon<br /> <font color="#666666">INFO</font> Call 704.463.1308</h2></p> </td> </tr> <!-- This seems to be the cause of it. If I have a couple sentences down here its fine, but more than a few words and it causes sheer html chaos above! --> <tr> <td colspan="3"><img src="../images/10spacer.png" width="10" height="10"><br /><hr width=100% size=1px color=#99CC33> <img src="../images/10spacer.png" width="10" heigh="10"><br /> <h2 class="text">Party in the Park is an annual Richfield tradition started in 199X to gather the town's residents and their friends together to enjoy good food, fun entertainment and each other's company. This year we'll have blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah. The morning will end right with our famous Cush cookoff! Party in the Park is an annual Richfield tradition started in 199X to gather the town's residents and their friends together to enjoy good food, fun entertainment and each other's company. This year we'll have blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah. The morning will end right with our famous Cush cookoff! </h2> <br /><img src="../images/25spacer.png"><br /> <p><h1 class="menu2">Features</h1></p> <p><h1 class="menu2">Photos</h1><hr width="100%" size="1px" color="#99CC33"></p> <p><h1 class="menu2">Flyer</h1></p> <p><h1 class="menu2">Directions</h1></p> </td> </tr> <!-- And everything from here on out seems to be fine from what I can tell --> <tr> <td height="75" colspan="5"> </td> </tr> <tr> <td colspan="5" valign="top"><hr width="100%" padding-bottom="1px"> <div align="right"><font color="#99CC33"><em><font color="#000000" size="-7" face="Verdana, Arial, Helvetica, sans-serif">email us at </font><font size="-7" face="Verdana, Arial, Helvetica, sans-serif">web@gorichfield.com</font></em></font></div></td> </tr> </table> </body> thanks again for any help guys! Hello all! This is my first website, and of all the languages I've had to start learning to produce it, HTML is by far the most infuriating. My site is www.B3-Office.com and the issue is the layout. It is completely wrong on every page. If you look in the source it should show that my top nav bar is set to be only 94 px in width per cell (10 cells), slightly larger than some of the text therein. The "Contact" text is supposed to be far left. Then the rest of the site, the pages are just all messed up in formatting, looking nothing like it does in my WYSISWYG program (DreamWeaver CS4). I have 4 pages in this format: home, contact, aboutus, and privacy. None of which are working properly. HELP! What am I missing? I would also appreciate your feedback on my work. Thanks so much!!! can i have fixed layout for only some part of a table? I want the first column of my table to be "auto" and the other columns to be "fixed" llike style='table-layout:fixed;'. How can I achieve this? Thanks! I have a very simple table that I cannot simply get to render correctly across IE, Firefox, and Opera. At first, I was using CSS to define the cell widths/heights - when that was giving me issues I got rid of all the CSS and attempted to use plain HTML. The problem persisted. Here's the code - it doesn't get much simpler than this: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1"> <tr> <td width="15" height="33">a</td> <td>b</td> <td>c</td> <td width="15" height="33">d</td> </tr> <tr> <td colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Appearance in Opera Appearance in IE7 Appearance in Firefox (this is what I want it to look like in all browsers) I haven't done HTML seriously in 7-8 years or so but I don't really remember having these problems with IE/Netscape. The fix I found for IE was to use style="table-layout: fixed" for the table: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1" style="table-layout: fixed"> <tr> <td width="15" height="33">a</td> <td>b</td> <td>c</td> <td width="15" height="33">d</td> </tr> <tr> <td colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Now IE works fine, Firefox didn't break, but Opera's cells still are not 15 pixels. IE7 Appearance fixed Here's my attempt at getting Opera to display it properly by mixing CSS and HTML: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <table cellspacing="0" cellpadding="0" border="1" style="table-layout: fixed"> <tr> <td style="width: 15px; height: 33px" width="15" height="33">a</td> <td style="height: 33px">b</td> <td style="height: 33px">c</td> <td style="width: 15px; height: 33px" width="15" height="33">d</td> </tr> <tr> <td style="width: 100%" width="100%" colspan="4" rowspan="1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td> </tr> </table> </BODY> </HTML> Opera looks even worse now This seems like such a simple table. I really don't understand why I'm having such a hard time. I believe the second row - using colspan is causing the issue. Please don't answer with - "dont use tables" or something silly like that Thank you -TableTrTd Hi everyone. I have a website (this one) which I made starting from a template. I modified it to suit, and learned basic html as I went, but I foresee a problem. The site is currently made up of a small enough number of pages that, when I have to change something in the left menu, or update the copyright notice on the bottom, or do any modification that doesn't involve the actual contents, I can do it in all the html files in a more or less automatic way with a text replacer and have done with it. This is, however, not an efficient solution, and requires reuploading every html page. Now, consider for a moment the layout of this site. There's a left frame with a menu, a top one with tabs, and the main center one with the actual contents. Clicking a link on the left will open the linked-to html page in the main frame. I would like my site to have the appearance it has now, with the frame layout of the other one. This way when changing the menu I'd only have to change and upload one html file, and I could write content without worrying about the rest of the page. I could just adapt the html from the example site and incorporate it in my own, but I've been told HTML frames are an inelegant and inefficient way of doing this, that they sometimes mess up the visualization, that they make it harder for search engines to index you and that I should do it with CSS instead (of which I know not a thing). I'd like your opinion on this before I start potentially wasting time adapting html. Also, whichever way I proceed, I would like to change the colour of the spacer and scroll bars from the ugly standard windows-grey to the violet/blue background colour of my site. Can this be done at all, and if so how? Thanks. Hi. My problem is this... When I zoom in on my site to see it more clearly in close up, it is behaving very strangely. The content in the RH column starts overlapping the menu, which is in the centre column, and positions part of itself behind the menu buttons. The link for the trial version of the site is: http://www.advancewebsolutions.co.uk/commonthread/ I'm not sure whether this is a HTML or CSS problem, but I'd be grateful if anyone could spot what is causing this problem. Many thanks in antiicpation... Hi There, Pulling my hair out over this. For the life of me, cant make it work: http://www.cowboytuffwebsitedesign.c...cialdeals.html I've used positive padding negative margin to stretch both div's heights to match each other. But the content div, when needed to be higher than the menu div, will overflow its content past the container divs bg. As well the footer will only clear past the menu div, not the content div. HELP! PLEASE! I can copy and paste HTML right into the thread if needed. Thanks |
|||||||