Guest tbltk Posted January 23, 2006 Share Posted January 23, 2006 When I type in the content cell in the middle (with the lorem ipsum and o fortuna thrown in), it resizes the cell with the links and the cell with the mock google adds. Why is that? It happens with every layout I try making.Thanx. <html><head><style type="text/css"><!--.class1 A:link { text-decoration: underline; color: #ffffff; font-weight:bolder;}.class1 A:visited { text-decoration: underline; color: #ffffff; font-weight:bolder; }.class1 A:active { text-decoration: underline; color: #999999; font-weight:bolder;}.class1 A:hover { text-decoration: underline; color: #999999;}.bigbox { border-width:1px; border-style:solid; border-color:#000000;}.sides {border-left-width:1px; border-style:solid; border-color:#000000;}#Table_01 td {}.boxes { padding: 10px;border-width:1px; border-style:solid; border-color:#000000;}.nav { padding-left: 10px; margin-left: 10px;}.style1 {color: #FFFFFF}.navlinks { text-indent:10px;}.left { border-right-width:1px; border-style:solid; border-bottom-color:#000000;}--></style><title>redline</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head><body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"><!-- ImageReady Slices (redline.psd) --><br><table width="831" height="639" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01"> <tr> <td colspan="8" background="images/redline2_01.gif"><div align="center"><img src="images/logo.gif" width="494" height="112"></div></td> <td><img src="images/spacer.gif" width="1" height="112" alt=""></td> </tr> <tr> <td colspan="8" background="images/redline2_02.gif"> </td> <td><img src="images/spacer.gif" width="1" height="13" alt=""></td> </tr> <tr> <td rowspan="4" background="images/redline2_05.gif"> </td> <td background="images/redline2_04.gif" bgcolor="#FFFFFF"><div align="center" class="style1">Navigation</div></td> <td rowspan="4" bgcolor="#6B6B6B"> </td> <td background="images/redline2_06.gif"><div align="center" class="style1">Home</div></td> <td colspan="2" background="images/redline2_07.gif"> </td> <td background="images/redline2_04.gif"><div align="center" class="style1">Advertisements</div></td> <td rowspan="4" background="images/redline2_09.gif"> </td> <td><img src="images/spacer.gif" width="1" height="34" alt=""></td> </tr> <tr> <td bgcolor="#5E5E5E" class="boxes"><p class="class1"><a href="#">Link 1</a></p> <p class="class1"><a href="#">Link 2</a></p> <p class="class1"><a href="#">Link 3</a></p> <p class="class1"><a href="#">Link 4</a></p> <p class="class1"><a href="#">Link 5</a></p> <p class="class1"><a href="#">Link 6</a></p> <p class="class1"><a href="#">Link 7 </a></p></td> <td colspan="2" rowspan="2" valign="top" bgcolor="#5E5E5E" class="boxes"><p align="justify">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec id sem ut libero scelerisque dictum. Suspendisse molestie venenatis turpis. In pellentesque. Vivamus suscipit. Fusce at justo in sem tristique tempor. Mauris sit amet metus. Fusce accumsan metus eget quam. Mauris dapibus dictum justo. Mauris neque metus, sodales ut, luctus non, ullamcorper eu, ante. Nulla pede. Ut tincidunt facilisis est. Ut cursus dignissim orci. </p> <p align="justify">O fortuna, velut luna statu variabilis, semper crescis aut descrescis; vita detestabilis nunc obdurat et tunc curatludo mentis aciem, egestatem, potestatem dissolvit ut glaciem. </p> <p align="justify">Nunc tellus erat, venenatis sit amet, malesuada luctus, cursus sit amet, erat. Suspendisse tortor ligula, facilisis id, molestie facilisis, consectetuer sit amet, erat. Nunc quis quam a turpis volutpat consectetuer. Praesent quis ipsum. Cras risus. Pellentesque mauris nulla, lacinia id, laoreet non, gravida at, lorem. Aliquam egestas. Curabitur vel nibh. Fusce ut dolor. Curabitur imperdiet mollis nunc. Donec tellus diam, sollicitudin eu, mollis semper, condimentum vitae, velit. Quisque ut lacus in lectus sodales fringilla. Integer eu purus. Aliquam mauris sem, porta at, dignissim non, aliquam ac, lectus. Etiam id lorem. Integer sed nisi. Aenean ut ligula. </p> </td> <td rowspan="3" background="images/redline2_12.gif"> </td> <td bgcolor="#5E5E5E" class="boxes"><div align="center"><img src="images/adds.png" width="120" height="240"></div></td> <td><img src="images/spacer.gif" width="1" height="222" alt=""></td> </tr> <tr> <td rowspan="2" bgcolor="#6B6B6B"> </td> <td rowspan="2" background="images/redline2_15.gif"> </td> <td height="165"><img src="images/spacer.gif" width="1" height="56" alt=""></td> </tr> <tr> <td colspan="2" bgcolor="#6B6B6B"> </td> <td><img src="images/spacer.gif" width="1" height="14" alt=""></td> </tr> <tr> <td colspan="8" background="images/redline2_17.gif"><div align="center"><span class="style1">©2006 Lorum Ipsum. All rights reserved. Site best viewed in screen resolutions 830*640 or higher </span></div></td> <td><img src="images/spacer.gif" width="1" height="27" alt=""></td> </tr> <tr> <td><img src="images/spacer.gif" width="15" height="1" alt=""></td> <td><img src="images/spacer.gif" width="153" height="1" alt=""></td> <td><img src="images/spacer.gif" width="16" height="1" alt=""></td> <td><img src="images/spacer.gif" width="463" height="1" alt=""></td> <td><img src="images/spacer.gif" width="1" height="1" alt=""></td> <td><img src="images/spacer.gif" width="14" height="1" alt=""></td> <td><img src="images/spacer.gif" width="153" height="1" alt=""></td> <td><img src="images/spacer.gif" width="15" height="1" alt=""></td> <td></td> </tr></table></body></html> Link to comment Share on other sites More sharing options...
Err Posted January 26, 2006 Share Posted January 26, 2006 The problem is that you are using the table cells as a whole and as a result everything you add in the middle cell moves the left and right cells down also.This should get you out of that problem: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">/*Controls default text colors*/html, body { color: black;}/*Controls Header Cell*/.header { text-align: center;}/*Controls the left "table"*/.boxes { padding: 10px; border: 1px solid black; background-color: #5E5E5E; width: 100%;}/*Controls right "table"*/.imagebox { border: 0px; padding: 10px; background-color: #5E5E5E; width: 100%;}/*Controls the middle "table"*/.content { vertical-align: top; padding: 10px; border: 1px solid black; background-color: #5E5E5E;}/*Controls Left and Right Cells*/.cellwidth { width: 120px; vertical-align: top;}/*Controls the middle "Cell"*/.contentwidth { veritcal-align: top;}a:link { text-decoration: underline; color: #ffffff; font-weight:bolder;}a:visited { text-decoration: underline; color: #ffffff; font-weight:bolder;}a:hover { text-decoration: underline; color: #999999;}a:active { text-decoration: underline; color: #999999; font-weight:bolder;}</style> </head><body><table> <tr> <td class="header" colspan="3"> Header Image </td> </tr> <tr colspan="3"> <td class="cellwidth"> <table class="boxes"> <tr> <td> <p><a href="#">Link 1</a></p> <p><a href="#">Link 2</a></p> <p><a href="#">Link 3</a></p> <p><a href="#">Link 4</a></p> <p><a href="#">Link 5</a></p> <p><a href="#">Link 6</a></p> <p><a href="#">Link 7</a></p> </td> </tr> </table> </td> <td class="contentwidth"> <table class="content"> <tr> <td> <p align="justify">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec id sem ut libero scelerisque dictum. Suspendisse molestie venenatis turpis. In pellentesque. Vivamus suscipit. Fusce at justo in sem tristique tempor. Mauris sit amet metus. Fusce accumsan metus eget quam. Mauris dapibus dictum justo. Mauris neque metus, sodales ut, luctus non, ullamcorper eu, ante. Nulla pede. Ut tincidunt facilisis est. Ut cursus dignissim orci. </p> <p align="justify">O fortuna, velut luna statu variabilis, semper crescis aut descrescis; vita detestabilis nunc obdurat et tunc curatludo mentis aciem, egestatem, potestatem dissolvit ut glaciem. </p> <p align="justify">Nunc tellus erat, venenatis sit amet, malesuada luctus, cursus sit amet, erat. Suspendisse tortor ligula, facilisis id, molestie facilisis, consectetuer sit amet, erat. Nunc quis quam a turpis volutpat consectetuer. Praesent quis ipsum. Cras risus. Pellentesque mauris nulla, lacinia id, laoreet non, gravida at, lorem. Aliquam egestas. Curabitur vel nibh. Fusce ut dolor. Curabitur imperdiet mollis nunc. Donec tellus diam, sollicitudin eu, mollis semper, condimentum vitae, velit. Quisque ut lacus in lectus sodales fringilla. Integer eu purus. Aliquam mauris sem, porta at, dignissim non, aliquam ac, lectus. Etiam id lorem. Integer sed nisi. Aenean ut ligula.</p> </td> </tr> </table> </td> <td class="cellwidth"> <table class="imagebox"> <tr> <td> <img src="" alt="" style="height:80px; width:60px;"><br> <img src="" alt="" style="height:80px; width:60px;"> </td> </tr> </table> </td> </tr></table></body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now