HTML - Formatting Issue - Can't Get Rid Of Vertical Space
I just have a small formatting issue, that I think is being caused by a dreamweaver template I created, that I need some quick help with. Under the main banner is a space that I want to get rid of, but I can't figure out what's causing it. In my template, the editable area starts with the div right under the banner... so I'm thinking somewhere in there is my issue. Here is a link to the site - www.captaintees.com/graphictees.html
Any help is greatly appreciated. Similar TutorialsI just started learning HTML from through Lynda.com. I ran into a problem of which I cant seem to find what went wrong. This image I horizontally splitted it in 3 parts which needed to resolve in HTML as 1 image. Between each image there now is a horizontal space. This is only the case in Firefox and Google Chrome. In Explorer it works fine. What did I do wrong? <table border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="images/1.gif" alt="" /></td> </tr> <tr> <td><img src="images/2.gif" alt="" /></td> </tr> <tr> <td><img src="images/3.gif" alt="" /></td> </tr> </table> Thank you. you can view the page: www.yanglihao.com <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <title>浩</title> <head id="ctl00_Head1"> <style type="text/css"> <!-- A:link {color:#993333;text-decoration:none} A:visited {color:#993333;text-decoration: none} A:hover {color:#778833;background:#553333;text-decoration: none} body { font: 100% Verdana, Arial, Helvetica, sans-serif; background: #111122; margin: 0; padding: 0; text-align: center; color: #000000; } .thrColFixHdr #container { width: 780px; background: #CCCCDD; margin: 0 auto; border: 1px solid #000000; text-align: left; } .thrColFixHdr #header { background: #221122; padding: 0 10px 0 20px; } .thrColFixHdr #header h1 { margin: 0; padding: 10px 0; width: 780px; } .thrColFixHdr #sidebar1 { float: left; width: 150px; background: #111522; padding: 15px 10px 15px 20px; } .thrColFixHdr #sidebar2 { float: right; width: 160px; background: #111522; padding: 15px 10px 15px 20px; } .thrColFixHdr #mainContent { margin: 0 200px; padding: 0 10px; } .thrColFixHdr #footer { padding: 0 10px 0 20px; background:#111122; } .thrColFixHdr #footer p { margin: 0; padding: 10px 0; } .fltrt { float: right; margin-left: 8px; } .fltlft { float: left; margin-right: 8px; } .clearfloat { clear:both; height:0; font-size: 1px; line-height: 0px; } .STYLE3 { font-size: xx-small; color: #999966; } --> </style> <title> Untitled Page </title></head> <body class="thrColFixHdr"> <form name="aspnetForm" method="post" action="default.aspx" id="aspnetForm"> <div> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTEwMDUyNjYzMjgPZBYCZg9kFgICAw9kFgICAw88KwAJAQAPFgQeCERhdGFLZXlzFgAeC18hSXRlbUNvdW50AghkFhBmD 2QWAgIBDw8WBB4EVGV4dAUG5a2k54usHgtOYXZpZ2F0ZVVybAUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTFkZAIBD2QWAgIBDw8WBB8CBRjmsqHmnInml6DnvJjml6DmlYXnmoTniLEfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTJkZAICD2QWAgIBDw8WBB8CBQzpvJPlkLnoh6rnlLEfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTNkZAIDD2QWAgIBDw8WBB8CBQblir/liKkfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTRkZAIED2QWAgIBDw8WBB8CBQPniLEfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTVkZAIFD2QWAgIBDw8WBB8CBQzpvJPlkLnoh6rnlLEfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTNkZAIGD2QWAgIBDw8WBB8CBQnlpbPlranlrZAfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTZkZAIHD2QWAgIBDw8WBB8CBQ/kuI3lj5HnmoTmg4XkuaYfAwUafi9hcnRpY2xlLmFzcHg/YXJ0aWNsZUlEPTdkZGSwWPnKc69cmrv7vR5KoJ9/RM55iA==" /> </div> <div id="container"> <div id="header"> <table width="100%" border="0" background="image/yanglihaobarner.jpg" style="height: 40px"> <tr> <td></td> </tr> </table> <div id="sidebar2"> <div id="tip" style="font-size:medium;color:#FFCC00;height:400px"> <span style="color: #ccff33; font-size: 16pt;"><a target="_blank" href="Default.aspx">首页</a></span> | <br /> <br /> <span style="color:#9933cc"> <span style="font-size: 16pt"><a target="_blank" href="album.aspx">相册</a></span></span> | <br /> <br /> <span style="color: #cc9933; font-size: 16pt;"><a target="_blank" href="uploadPhotoes.aspx">上传</a></span> | <br /> <br /> <span style="color: #cc9933; font-size: 16pt;"><a target="_blank" href="liuyan.aspx">留言</a></span> | <br /> <br /> <span style="color: #cc9933; font-size: 16pt;"><a target="_blank" href="Login.aspx">聊天</a></span> | <br /> <br /> </div> </div> </div> <div id="sidebar1"> <table width="100" border="0"> <tr> <td><span class="STYLE3">用户名</span></td> <td> <input name="username" type="text" id="username" size="10" /></td> </tr> <tr> <td><span class="STYLE3">密码</span></td> <td><input type="password" id="password" size="10" /></td> </tr> <tr> <td> </td> <td><input type="button" onclick="validate" value="确定" /></td> </tr> </table> <br /> <br /> <table id="ctl00_DataList1" cellspacing="0" border="0" style="border-collapse:collapse;"> <tr> <td> <a id="ctl00_DataList1_ctl00_HyperLink1" href="article.aspx?articleID=1" style="text-decoration:underline;">孤独</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl01_HyperLink1" href="article.aspx?articleID=2" style="text-decoration:underline;">没有无缘无故的爱</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl02_HyperLink1" href="article.aspx?articleID=3" style="text-decoration:underline;">鼓吹自由</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl03_HyperLink1" href="article.aspx?articleID=4" style="text-decoration:underline;">势利</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl04_HyperLink1" href="article.aspx?articleID=5" style="text-decoration:underline;">爱</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl05_HyperLink1" href="article.aspx?articleID=3" style="text-decoration:underline;">鼓吹自由</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl06_HyperLink1" href="article.aspx?articleID=6" style="text-decoration:underline;">女孩子</a> </td> </tr><tr> <td> <a id="ctl00_DataList1_ctl07_HyperLink1" href="article.aspx?articleID=7" style="text-decoration:underline;">不发的情书</a> </td> </tr> </table> </div> <div id="mainContent"> <div style="height: 890px; width: 344px"> <blockquote> <br /><br /> <center><strong>女孩子 </strong> <p>我爱着自由,爱着孤僻。 </p> <p> 在学校,我认识很少的女孩子。 曾经感觉她们会如我想象中的那么热情,又知情达理。 很想知道她们有什么奇怪的想法,深邃的感情。 男女不会像爱情电影中的主人公可以天天躺在缀着玫瑰花的炕上,也不会只有如毛片中机械的亢奋。 </p> <p>我爱走在遥远的后面望着她们的背影,略去她们的妍媸,幻想她们一定有什么秘密的故事。</p> <p>我幼稚地去试着和她们搭讪,像素面的姐姐或妹妹。她们应该会忽视我所有的缺点吧。</p> <p>现在,我才感觉到我想的很可能是错的,或多或少。</p> <p>我有时在她们面前说出有关性这些被忌讳的话题。 她们惊讶地沉默,不知道是否嗤之以鼻过。想去问一问她们对低俗的理解,却心思疲惫。</p> <p>我对于她们也许只是太普通的人,不是爱人,不是兄弟,不是朋友。人似乎只是为了直接的好处或潜在的利益在伪善与高贵中徘徊。</p> </center> </blockquote> </div> </div> <br /> <table width="779" border="0" align="center"> <tr> <td> </td> </tr> <tr> <td> <div align="center"> </div> </td> </tr> </table> <br class="clearfloat" /> <div id="footer"> <table width="100%" border="0"> <tr> <td> </td> </tr> </table> </div> </div> </form> </body> </html> OK - I want you you to know, I don't know what I'm doing. But I'm trying to build my web site and I'm just about there but am having one problem. The problem page is he http://www.danielrubio.com/clientlogin.html and he http://www.danielrubio.com/listeningroom.html I can't get the navigation area on the left to occupy the same vertical position as the login form. With the second page I can't get the navigation area on the left to occupy the same vertical position as the links to my MP3's. The reason I set things up this way to start with was to keep the form and the links centered on the page no matter what size window or screen resolution. Here is the code for the first problem page: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <script language="JavaScript"> function Login(){ var done=0; var username=document.login.username.value; username=username.toLowerCase(); var password=document.login.password.value; password=password.toLowerCase(); if (username=="luckydog" && password=="sunshine") { window.location="http://www.danielrubio.com/heidi/juliexyz.html"; done=1; } <!-- The user above is Julie Rubio 070216 --> if (username=="bighands" && password=="hardwork") { window.location="http://www.danielrubio.com/guest/12345678.html"; done=1; } <!-- The user above is Guest 070216 --> if (username=="member1" && password=="password1") { window.location="page1.html"; done=1; } if (username=="member2" && password=="password2") { window.location="page2.html"; done=1; } if (username=="member3" && password=="password3") { window.location="page3.html"; done=1; } if (done==0) { alert("Invalid login!"); } } // End --> </script> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <meta name="keywords" content="daniel rubio, composer, orchestrator, tuba, new orleans, last days, derringer, sidewalk, second line, music, bmi, garritan, dixieland, theater, jazz, bourbon, imdb"> <meta name="robots" content="index, follow, noarchive"> <meta name="description" content="Daniel Rubio is a composer and orchestrator for theater film and television from New Orleans and a tuba player"> <title>DANIEL RUBIO</title> </head> <body style="color: rgb(0, 0, 0); background-color: rgb(192, 192, 192); height: 646px;" alink="#000099" link="#000099" vlink="#990099"> <table style="text-align: left; font-family: Helvetica,Arial,sans-serif; background-color: transparent; width: 100%; height: 100%;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td colspan="2" rowspan="1" style="text-align: center; width: 100%; height: 96px;"><big><big><big><span style="font-weight: bold;"> </span></big></big></big> <h1 style="font-weight: bold; height: 25px;">D <small>A N I E L</small> R <small>U B I O</small></h1> <big><big><big><small><small>Composer | Orchestrator</small></small></big></big></big></td> </tr> <tr> <td colspan="2" rowspan="1" style="width: 100%; height: 108px;"> <big><big><big><img style="position: absolute; width: 108px; height: 144px; top: 57px; left: 96px;" alt="Photograph of Daniel Rubio" src="../../photogs/DanBW45a.jpg"></big></big></big><font size="+1"> </font> <div style="text-align: center; margin-top: 0px; height: 92px;"><font size="+1"><span style="color: rgb(51, 51, 51);"></span></font><big><span style="color: rgb(51, 51, 51);"><big><small><small><small><br> <br> <big><big><big>C</big>LIENT <big>L</big>OGIN<br> <br> <br> <br> <br> </big></big></small></small></small></big></span></big><big><span style="color: rgb(51, 51, 51);"><big><small><small><small><big><big> <center> <form name="login"> <table style="width: 225px;" border="1" cellpadding="3"> <tbody> <tr> <td colspan="2"> <br> <div =""> <center><font size="+2"><b>Welcome!</b></font></center> </div> </td> </tr> <tr> <td>Username:</td> <td><br> <div style="z-index: 2;"><input name="username" type="text"></div> </td> </tr> <tr> <td>Password:</td> <td><input name="password" type="text"></td> </tr> <tr> <td colspan="2" align="center"><input value="Login!" onclick="Login()" type="button"></td> </tr> </tbody> </table> </form> </center> </big></big></small></small></small></big></span></big></div> </td> </tr> <tr style="color: rgb(51, 0, 153);"> <td style="vertical-align: top; text-align: center; width: 20%; background-color: rgb(153, 153, 153); height: 337px;"><small><big><big> </big></big><br> <a href="http://www.danielrubio.com/index.html">Home</a><br> <br> <a href="http://www.danielrubio.com/clientlogin.html">Client Login</a><br> <br> <a href="http://www.danielrubio.com/listeningroom.html">Listening Room</a><br> <br> <a href="http://www.danielrubio.com/biography.html">Biography</a><br> <br> <a href="http://www.danielrubio.com/news.html">News</a><br> <br> <a href="http://www.danielrubio.com/links.html">Links</a><br> <br> <a href="http://www.danielrubio.com/sitemap.html">Site Map</a><br> <br> <a href="http://www.danielrubio.com/feedback.html">Feedback</a></small></td> <td style="text-align: center; width: 80%; height: 337px;"><br> <div style="position: absolute; left: 240px; top: 377px;"><span style="font-weight: bold;"><span style="color: rgb(0, 0, 0);"></span> </span><br> <span style="font-weight: bold;"></span></div> </td> </tr> <tr> <td colspan="2" rowspan="1" style="text-align: center; width: 100%; background-color: rgb(153, 153, 153); height: 96px;"><span style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">Copyright © 2006 - </span><span style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">2007 by </span><a style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;" href="http://www.danielrubio.com/feedback.html">Daniel Rubio</a><span style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">. All worldwide rights reserved.</span><br style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;"> <span style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">Second Line Music™ is a trademark of Daniel Rubio.</span><span style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;"><br> </span></td> </tr> </tbody> </table> <span style="font-family: Helvetica,Arial,sans-serif;"> </span> </body> </html> I think that if you help me to understand the correct approach to the first page, I can then apply it to the second page. Thanks for any help, Dan Hello, Here is the site I am having difficulty with. http://mysite.verizon.net/ekafrawy/Modern/index.html If you view this page in FF, the formatting is fine, but when you view it in IE, the spacing on the left nav bar is not right. Anyone have some tips on how to correct this? Thanks, Eric Hi All, Here is a small html file I have written. This is not formatting correctly in browser. Width is not recognised by browser. Thanks in advance for your help. Regards, Pratap Tripathy ---------------------------------- <html> <head> <TITLE>Analytical Method Report</TITLE> </head> <body> <center><p><b><u>Analytical Method Report</u></b></p></center> <table border=1 width="700px"> <tr> <td width="10px"> </td> <td width="80px">Method</td> <td width="10px">:</td> <td width="500px">11111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111222222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222223333333333333333333333333333333333333333333333 3333333333334444444444444444444444444444444444444444444444444444444455555555555555555555555555555555 55555555555555<</td> </tr> </table> </html> ---------------------------------- I have a very little task here and I can not figure out the best way to do it without using tables.... I will if I have to but I would rather not. below is a paragraph on my website: Rebuttal – They fail to mention that any taxes/bond use to buy Golden State Water Company will result in a reduction in water rates far in excess of any tax. See details in the Summary Flyer..... I want the the next line to go under the the word "They" (the first word after rebuttal) so the word rebuttal is just off on the left by itself. Here is the code of the paragraph: <strong>Rebuttal</strong> – They fail to mention that any taxes/bond use to buy Golden State Water Company will result in a reduction in water rates far in excess of any tax.... Thank you guys so much in advance I could really use the help! Below is my simple table from a more complex table. The issue I am having is the first <td></td> is variable height. In my second <td></td>, "abc" should be at the top in that <td> and "def" should be at the bottom in that <td>, leaving some <void> space in the middle which will shrink or grow based on the first <td> height. Any tag(s) can be used inside is the second <td></td> Any suggestions? Thanks Code: <table> <tr> <td><br><br><br><br><br><br><br><br></td> </tr> <tr> <td> abc def </td> </tr> </table> When I view the HTML in a normal IE browser it works fine: www.virtuosovideo.com/myspace When I plug the same HTML into a MySpace profile the table gets broken up: www.myspace.com/adamhaviland Any idea why? Your help is greatly appreciated. Thanks, Adam Hi All, I am facing issues with having more than single space in between a string while displaying it in the list box Example:- <select name="listfield"> <option value="HTML">HTML <option value="HTML TAG">HTML TAG <option value="HTML TAG select">HTML TAG select Now the issue is with the third option.while displaying it on the screen it removes that extra space and displays it as "HTML TAG select" .the actual space between "TAG" and "select" is two white spaces where as it's shown as a single space. Thanks in advance YUGA I got this little problem, if you view the below page on IE it shows fine, but on FF it shows a space after the flash. http://www.test.muslimways.com Any advice? i almost went crazy trying to troubleshoot this one... thought i'd share. HTML Code: <style type=text/css> a:link {font-family:Arial, Helvetica, sans-serif; font-size:12px;} </style> <table width="200" border="0" cellspacing="0" cellpadding="0"><tr> <td width="100" valign="top"> <a href="link">Sample text </a> <td width="100" valign="top"> <a href="link">Sample text</a> </td></tr></table> Turns out a "space" at the end of the link text pushes the text upwards slightly. Simply remove the space (or add on to the other line) or use the space code [ ] The css also plays a part, this doesn't appear happen when text is "unformatted" Hi everyone.. I;ve just launch my new webiste but IE seems to have messed up some of the formatting. Is there an eastyfix/tool to remedy this? All other browsers see fine. I have tested in Browsershots... Thanks Hey there just starting to make a new site, and just kinda slowly making pages and trying to get the formatting and looks down first. anyways here is my site: http://uberwalla.com and you may notice depending on the resolution the footer is not at the very bottom its kinda floating high with a gray bottom under it. I am just wondering how i can make it so that no matter what resolution and no matter what browser, that it'll automatically make the footer the very bottom (touching the status bar or past it have to scroll down) no matter the size of the page. thanks in advance, uberwalla I was wondering if anyone could help me. I have two DIVs. One is 43px high and 100% width. The second I want to be 100% high - 43 px. Is there a way to do this with CSS without resorting to Javascript? Many thanks. Hi Team, I'm having problems formatting images in HTML. Here is my site: http://ledtvprices.org.uk/ I would like to "left align" the merchant logo buttons at the top so that they all sit evenly above the H1 Tag and start from the left to the right, rather than the middle of the page. I'd also like to left align all the tv images and space them all out evenly. How do I achieve this in HTML? Thanks. Sunil. Hi, I made a webpage using dreamweaver 8. When i preview the page in firefox it has not problems in design layout of the page but when i view it in IE it breaks the design format and is messed up. Can anyone guide me as to why it would do it and how i can fix it? Also, when i try to display some text in Chinese, it shows random characters. I changed the fonts in internet options to display Chinese but it didn't work. I have viewed Chinese websites and they i didn't have any problem in seeing the text. Any reason or suggestion as to why it would do this? I would really appreciate any help on this, Thanks, Hello I am hopeless with html. I need to know how to be able to use the space to left (and maybe right) of the apartment ads on this page http://www.asia-expatsforum.com/phpB...apartments.php the ads are java script which I have centered on the page. its a php page but the space between the header and footer is html. whatever I try it either goes above or below the ads--i want to use the space to the left for other ads etc. do I have to create a table? or?? thanks Hi, I have an unusual problem. I am linking pages for my website, and I am sure that I have the formatting correct, but for some reason, when I reference my page (which is in a different directory) from a page within my root web folder, the formatting is gone. I am currently using simple html. My reference is as follows from my page within the root directory: <a href="/directory/directory/page.html">Text</a> The page works perfectly fine when it is in the root directory, but as soon as I move it to the other directory "/directory/directory" the background color and header formatting are gone. I still have my tables in place, but everything else is messed up. Ideas? Help? |