Twentyoneth Posted June 23, 2006 Share Posted June 23, 2006 I have a page, where I have everything centered and vertically aligned to the top....problem is, with everything vAligned to the top, I still get a gap.. see here: [a href=\"http://12.27.247.70:8000/csite\" target=\"_blank\"]Example[/a]Any ideas on how to fix this?It works if I take out this little piece of code:[code] </td> </tr> <tr> <td>[/code]It is inbetween the "banner" table and the "content" table...[NOTE: Everything is aligned in the css. It still wont align correctly when aligned in html.] Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/ Share on other sites More sharing options...
bobleny Posted June 23, 2006 Share Posted June 23, 2006 I almost hate to suggest this because I was unsuccessful in solving your problem, but I went through you CSS and HTML and retuned it. It wasn’t working quite right. It actually aligned left in FF. That void is still there no matter what I do. Hopefully you’ll be able to solve your problem.To work on it easy I placed the css in the html...[code]<html> <head> <style type='text/css'> body { background-color: #000000; margin-top: 0px; margin-bottom: 0px; } div { background-color: #000000; text-align: center; margin-left: auto; margin-right: auto; } tr { vertical-align: top; } td { vertical-align: top; } .main { background-color: #FF0080; width: 700px; height: 100%; border-style: dashed; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 2px; border-right-width: 2px; border-color: #ffffff; padding-top: 0px; padding-bottom: 0px; padding-left: 10px; padding-right: 10px; margin-left: auto; margin-right: auto; margin-bottom: 0px; } .banner { background-color: #000000; background-image: url("P90.jpg"); width: 100%; height: 200px; border-style: dashed; border-top-width: 2px; border-bottom-width: 0px; border-left-width: 2px; border-right-width: 2px; border-color: #ffffff; padding-left: 0px; padding-right: 0px; padding-top: 0px; padding-bottom: 0px; } .content { width: 100%; height: 100%; background-color: #000000; vertical-align: top; margin-top: 0px; } .spacer { width: 100%; height: 100%; border-style: dashed; border-top-width: 2px; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-color: #ffffff; } .menu { width: 220px; height: 100%; border-style: dashed; border-top-width: 0px; border-bottom-width: 2px; border-left-width: 2px; border-right-width: 2px; border-color: #ffffff; text-align: center; } .link { width: 220px; height: 27px; background-image: url("P90.jpg"); text-align: center; vertical-align: top; } .closepic { width: 437px; height: 319px; background-image: url("P90.jpg"); filter-: alpha(oopacity=70); -m-oz-opacity: .70; border-style: dashed; border-width: 2px; border-top-width: 0px; border-color: #ffffff; vertical-align: top; } </style> </head> <body> <div> <table class='main' cellpadding='0' cellspacing='0'> <tr> <td> <table class='banner' cellspacing='0' cellpadding='0'> <tr> <td> </td> </tr> </table> </td> </tr> <tr> <td> <table class='content' cellspacing='0' cellpadding='0'> <tr> <td><!-- menu --><table class='menu' cellpadding='0' cellspacing='0'> <tr> <td> <table class='link'> <tr> <td> <font style='color: #ffffff;'> Link Here </font> </td> </tr> </table> </td> </tr></table><!-- /menu --> </td> <td class='spacer'> l </td> <td><!-- closepic --><table class='closepic'> <tr> <td> </td> </tr></table><!-- closepic --> </td> </tr> </table> </td> </tr> </table> </div> </body></html>[/code]Actually, I think it’s ridicules because from my perspective, it shouldn’t be doing that. Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/#findComment-48704 Share on other sites More sharing options...
Twentyoneth Posted June 23, 2006 Author Share Posted June 23, 2006 I'm trying to make it so I can just edit the css to change anything. Except I don't know how to do a layout without tables.... I've seen someone on here say something about using pure css, and no tables, but I have no idea how I would do that. Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/#findComment-48710 Share on other sites More sharing options...
bobleny Posted June 23, 2006 Share Posted June 23, 2006 I personally would rather use tables. To each his own. I of course have my site set up so I can change the whole layout and what not with only three files. I don't like to update all of my pages to change something small, however I greatly enjoy writing html. So for me, those three files will allow me this! Others of course want to change the whole layout and what not with one file, which would be the advantages to using css to control everything!The way you have it set up, you will be able to change the colors, size, ect. basic stuff. Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/#findComment-48712 Share on other sites More sharing options...
foreverhex Posted July 12, 2006 Share Posted July 12, 2006 hey, I cant see you your site on my work computer because of its network settings but it sounds like me and you have the same problem. On IE it leaves big ugly open space inbetween a part of your border? I have found out nothing, I use firefox and everything looks wonderful but IE has an weired issue. GRR. Tell me if you come up with anything, and Ill do the same for you. Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/#findComment-56760 Share on other sites More sharing options...
AndyB Posted July 15, 2006 Share Posted July 15, 2006 It might be easier to solve the problem if we could actually see some code - or even view the page on an accessible server.Could be merely a whitespace problem; could be an improperly coded table (unmatched tags, etc.); could be .. almost anything. Quote Link to comment https://forums.phpfreaks.com/topic/12698-valign/#findComment-58277 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.