HTML - Html Margin (i Think) Problem
the problem - Inbetween the nav bar and the body pic there is a gap! Iv tryed puting
"style="margin:0px; padding: 0px;" on everything, and no succes please post suggestions here oh! and im using server side scripting to include the header and footer, in the source it is commented were it begins and ends. also in fire fox the gap is much bigger the site - http://weddingspace.awardspace.com/ Thanks ~Oblivian Similar TutorialsI am currently creating some code containing a horizontal rule, some headers and a link that takes the user back to the top of the page. The page should look something like this... ------------------------------------------------------- HEADER ------------------------------------------------------- back to top HEADER How can I make it so that the header is the same distance from the horizontal rule regardless of whether the back to top link is present? At the moment whenever the 'back to top' link is present the header below is pushed down. Here is my code so far... Code: <style type="text/css"> a{ margin-left:700px; } h2{ margin-top:20px; } </style> <hr> <h2>HEADER</h2> <p>Paragraph here</p> <hr> <a href="#top">back to top</a> <h2>HEADER</h2> <p>Paragraph here</p> Is there a way in plain old HTML (not CSS) to place a margin around a <hr>? I'm somewhat new to HTML, and have searched all over, and can't find how to do this Hi, I'm new to HTML stuff. I have a problem. I try to make a banner using table (code below). The problem is that there are margins between the table and the page that I cannot remove (even by setting margin:0px). I wish that the image in the table fill completely the banner space and there is no white margin between the images and the surrounding page. Any helps will be appreciated. Thanks for your answer. Jeffry ------------------------------------------------------------------------------------------------ <style type="text/css"> #middlebanner { background: #ffffff url(./Heading-middle.jpg) repeat-x; top: 0px; } #tableheader { margin:0px; left : 0px; top : 0px; right: 0px; margin-bottom:0px; } </style> <table id="tableheader" border="0" cellspacing="0" cellpadding="0" width="101.99%"> <tr> <td> <img src="./Heading-left.gif" border="0" > </td> <td id="middlebanner" width="100%"> </td> <td> <img src="./Heading-right.gif" border="0" > </td> </tr> </table> Hi All, I am building a website that has traditional nested frames. I am staying away from iFrames for search engine purposes. I am having a problem lining up a fixed background and content on both IE and Firefox. I can get everything to line up perfectly in Firefox but then IE misaligns everything. When I try to line it up in IE it still doesn't line up perfectly and then screws it up on Firefox. The style I am using is: body { margin: 0px 0px 0px 0px; background: url(img/content_bg.jpg) top center fixed no-repeat; background-attachment: fixed;} It's being used on this page: http://therestaurantdesigngroup.com/new/main.htm (Look at it in IE and FF, currently it's working in FF only) The entire site with frames is http://therestaurantdesigngroup.com/new/ (Look at it in IE and FF) If you want to look at the source files download them he http://therestaurantdesigngroup.com/new/mbaweb.zip I am not worried about the bottom frame at this time. I want to fix main.htm first. Thanks! Ryan Somebody suggested I do this using list items instead of left-floating DIVs, so I did. But I have no other experience of working with lists and no matter what I do, I can't get the list items to sit right next to each other. There's always a gap between them that I can't get rid of. Code: <!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" lang="en" xml:lang="en"> <HEAD> <STYLE> ul { list-style-type:none; } li { display:inline; } #headings { font-family:Courier New; line-height:25px; font-size:16px; font-weight:bold; text-align:center; margin-top:10px; } #headings a { background-color:#000; padding:7px; padding-top:4px; padding-bottom:2px; border:1px solid #f00; } #headings A:link { color:#ccc; } #headings A:visited { color:#ccc; } #headings A:hover { background-color:#aaa; color:#000; } </STYLE> </HEAD> <BODY> <DIV id="headings"> <UL> <LI><A HREF="p1.html">News</A></LI> <LI><A HREF="p2.html" onMouseover=showmenu(event,linkset[0],'110px') onMouseout=delayhidemenu()>Produkt</A></LI> <LIl><A HREF="p3.html">Media</A></LI> <LI><A HREF="p4.html">Downloads</A></LI> <BR> <LI><A HREF="p5.html" onMouseover=showmenu(event,linkset[1],'166px') onMouseout=delayhidemenu()>Col Dee</A></LI> <LI><A HREF="p6.html">Contact</A></LI> <LI><A HREF="p7.html">Guestbook</A></LI> </UL> </DIV> </BODY> </HTML> As you can see the "panels" are split into two rows using a simple linebreak. By the way, I've managed to get zero top and bottom margins by controlling the line-height attribute. Can anyone help with this? Thanks for reading, Seymour. Hi, Do you know the answer to this question? (I wasted a lot of time trying figure out this problem, before finally giving up.) How do I get the book cover image to display with no left margin, while preserving the 5px right margin? It displays with no left margin in my WYSIWYG editor. But, it displays with a 5px left margin in IE and Firefox. Here is the code... <a target="_blank" title="New Covenant Theology" href="/images/stories/book/book_cover_original_size.jpg"> <img style="border-style: none; border-width: 0px; left-margin: 0px; right-margin: 5px; title=" alt="New Covenant Theology" src="/images/150x199.jpg" width="150" align="left" height="199" /></a> 24 Reasons Why All Old Testament Laws Are Cancelled and All New Testament Laws Are for Our Obedience. See God's law in redemptive history explained simply and clearly with 7 diagrams, 20 charts, and 702 verses. Dedicated to Reformed, Covenant Theologians; Seventh Day Adventists; and other Sabbath-keepers. Read 3, free chapters from the book now: <a href="/new-covenant-theology.htm" title="New Covenant Theology"><span class="style20">New Covenant Theology</span></a></p> And, here is the webpage... http://www.jesussaidfollowme.org/#biblestudies Thanks for your insight, Greg Gibson My html problem keeps failling, with all my image codes.. shown for 10 errors which are all for the images what's wrong? Here is the code: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- New Perspectives on HTML and XHTML 5th Edition Tutorial 2 Case 2 Fiddler Home Page Author: Date: 2-16-2011 Filename: home.htm Supporting files: fiddler.jpg --> <title>, ITSE 1411 Lab Project 2, Tutorial 2 Case 2, Due 02/23/2011</title> </head> <body> <div> <img src="fiddler.jpg" alt="Fiddler on the Roof" /> <hr /> <a href="home2.htm"><img src="home.jpg" alt="home" /></a> <a href="slide1txt.htm"<img src="start.jpg" alt="start" /></a> <a href="slide1txt.htm"<img src="back.jpg" alt="back" /></a> <a href="slide2txt.htm"<img src="forward.jpg" alt="forward" /></a> <a href="slide6txt.htm"<img src="end.jpg" alt="end" /></a> <br /> <a href="slide1txt.htm"<img src="thumb1.jpg" alt="slide1" style="border-width: 5" /></a> <a href="slide2txt.htm"<img src="thumb2.jpg" alt="slide2" style="border-width: 0" /></a> <a href="slide3txt.htm"<img src="thumb3.jpg" alt="slide3" style="border-width: 0" /></a> <a href="slide4txt.htm"<img src="thumb4.jpg" alt="slide4" style="border-width: 0" /></a> <a href="slide5txt.htm"<img src="thumb5.jpg" alt="slide5" style="border-width: 0" /></a> <a href="slide6txt.htm"<img src="thumb6.jpg" alt="slide6" style="border-width: 0" /></a> </div> <hr /> <div> <img src="slide1.jpg" alt="slide1" /> </div> <blockquote> <p><i>Do You Love Me?</i> sung by Deb Ingalls and Thomas Gates</p> </blockquote> </body> </html> i'm trying to build a web page using HTML but i'm trying to put pics on it but i dont know how to, can some1 tell me what to do? also can you have a look at my page and tell me if i need to do more to it please and how to do it. coz i feel it looks abit dull many thanks :) http://uk.geocities.com/leighton24@btopenworld.com/ I can't get the height of the outer box to fit tight around the smaller ones. It does in Safari but not in most browsers. <html> <body> <table border=1 width=634><td valign=top align=left><form><select id=ctAdmin ><option>Administrative Postings</option><option>Flick Two-to come</option><option>Flick Three-to come</td><td valign=top align=right><form><select id=ctFMA><option>Members Postings</option><option>Flick Two-to come</option><option>Flick Three & Four-to come</option></select></form>"); </body> </html> Hello This ain't working out so good I am trying to put some stuff on the grey part of the website, but when i do it puts it in between the menu, right under the home button, there is more buttons under the chat box and I wanna put the chat box on the grey part. The grey part of the website, the image is called "image_03" Here is a screenshot and the code will be listed below: Code: <html> <head> <title>CoAlliance</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 (Untitled-1) --> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td colspan="2"> <img src="images/image_01.jpg" width="1024" height="212" alt=""></td> </tr> <tr> <td> <a href=http://www.goldgaming.bravehost.com><img src="images/image_02.jpg" width="287" height="96" alt=""></td></a> <tr><td style="background-image: url('images/image_03.png');"><img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyNjQzNjkyMTY1OTMmcHQ9MTI2NDM2OTI4NzEwOSZwPTUzMTUxJmQ9Jmc9MSZvPTkwYTllY2MyMzg1YjQyOTU5ZDVi/ZmQyZWM2MDA2YmRl.gif" /><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="540" height="405" name="chat" FlashVars="id=82923250" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /><br><small><a target="_BLANK" href="http://xat.com/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://xat.com/web_gear/chat/go_large.php?id=82923250">Go Large!</a></small><br> </tr> </td></tr> </tr> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td> <img src="images/image_04.jpg" width="287" height="95" alt=""></td> </tr> <tr> <td> <img src="images/image_05.jpg" width="287" height="85" alt=""></td> </tr> <tr> <td> <img src="images/image_06.jpg" width="287" height="105" alt=""></td> </tr> <tr> <td> <img src="images/image_07.jpg" width="287" height="127" alt=""></td> </tr> <tr> <td colspan="2"> <img src="images/image_08.jpg" width="1024" height="48" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html> It would mean so much if you can redo the code or atleast help me out, thanks guys, I appreciate it ALOT. Can some one please take a look at this and help me get the images to line up as they should!!! http://www.ardmoreweatherlive.com/wx3.php code: <!-- ##### Main Copy ##### --> <br> <font face="verdana,arial" size="3"><center>Click on radar image for full size</center></font> <br> <center> <TABLE BORDER> <TR ALIGN=CENTER> <TH>Base Reflectivity<br><a href="/wx16.html"><img src="/resize-radar-image.php"></img></a></TH> <TH>Echo Tops<br><a href="/wx17.html""><img src="/resize-et-image.php"></img></a></TH> </TR> </TABLE> </center> <center> <TABLE BORDER> <TR ALIGN=CENTER> <TH>Base Velocity<br><a href="/wx18.html"><img src="/resize-bv1-image.php"></img></a></TH> <TH>Relative Velocity<br><a href="/wx19.html"><img src="/resize-srv1-image.php"></img></a></TH> </TR> </TABLE> </center> <br> </div> <!-- ##### Footer ##### --> Thanks again for the help,Doug I think this is a CSS issue so I posted in the CSS section. I know I have asked for help with problem before but I didn't get it sorted. The problem is the table stretches out for some reason.This only happens in Firefox 2.0. Screen shot: http://i111.photobucket.com/albums/n...Untitled-2.jpg I have attached some of the e portfolio to this thread, Thank you So, I'm working on my Myspace, and I decided to use a div overlay to make my own design in photoshop and export it so that I can have my own custom design. I had a friend help me with the div overlay part and I used this as the div overlay.. Code: <style type="text/css"> .cover{ position: absolute; background-color: rgb(255,255,255); top: 160px; left: 50%; margin-left: -400px; width: 800px; height: 900px; z-index: 2; padding: 0px; border-width: 0px; border-color: rgb(0,0,0) } </style> <div class="cover"></div> <div style="position:relative; height: 400px; overflow: hidden; border: 0px"><table><tr><td><table><tr><td> And with that, my entire profile was covered. So I designed my layout in photoshop, and saved it as a flattened image, and used "hotspots" on dreamweaver to link it. That was the only way I could think of to code it. The code works perfect, and the design looks great, but the problem is that it gets covered by the div overlay and gets placed in such a way that it moves the layout and some of the myspace features start showing in the background again. I can supply the source code of my myspace with the layout on it and div overlay. Any help in this matter is extremely appreciated. Thankyou very much guys. Hello This ain't working out so good I am trying to put some stuff on the grey part of the website, but when i do it puts it in between the menu, right under the home button, there is more buttons under the chat box and I wanna put the chat box on the grey part. The grey part of the website, the image is called "image_03" Here is a screenshot and the code will be listed below: Code: <html> <head> <title>CoAlliance</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 (Untitled-1) --> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td colspan="2"> <img src="images/image_01.jpg" width="1024" height="212" alt=""></td> </tr> <tr> <td> <a href=http://www.goldgaming.bravehost.com><img src="images/image_02.jpg" width="287" height="96" alt=""></td></a> <tr><td style="background-image: url('images/image_03.png');"><img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyNjQzNjkyMTY1OTMmcHQ9MTI2NDM2OTI4NzEwOSZwPTUzMTUxJmQ9Jmc9MSZvPTkwYTllY2MyMzg1YjQyOTU5ZDVi/ZmQyZWM2MDA2YmRl.gif" /><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="540" height="405" name="chat" FlashVars="id=82923250" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /><br><small><a target="_BLANK" href="http://xat.com/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://xat.com/web_gear/chat/go_large.php?id=82923250">Go Large!</a></small><br> </tr> </td></tr> </tr> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td> <img src="images/image_04.jpg" width="287" height="95" alt=""></td> </tr> <tr> <td> <img src="images/image_05.jpg" width="287" height="85" alt=""></td> </tr> <tr> <td> <img src="images/image_06.jpg" width="287" height="105" alt=""></td> </tr> <tr> <td> <img src="images/image_07.jpg" width="287" height="127" alt=""></td> </tr> <tr> <td colspan="2"> <img src="images/image_08.jpg" width="1024" height="48" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html> It would mean so much if you can redo the code or atleast help me out, thanks guys, I appreciate it ALOT. Hi all, Having a bit of a problem trying to verify a site with Google. Uploaded the meta tag code to the index.html page of our site via an FTP server, however when I view the site, it doesn't interpret the html as html, it just shows me the code. The coding that I put in the index.html file is the standard google meta tag verification code: <html> <head> <meta name="google-site-verification" content="iQ3ySqJZaIc0njNiOJyDq1OnskxGqraQvuGKaNAGlbY" /> <title> My title </title> </head> <body> page contents </body> </html> Any ideas why it isn't interpreting it as HTML? I can't verify by the other method because of some issues with forwarding. Any help would be much appreciated! Thanks, Joel Hello This ain't working out so good I am trying to put some stuff on the grey part of the website, but when i do it puts it in between the menu, right under the home button, there is more buttons under the chat box and I wanna put the chat box on the grey part. The grey part of the website, the image is called "image_03" Here is a screenshot and the code will be listed below: Code: <html> <head> <title>CoAlliance</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 (Untitled-1) --> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td colspan="2"> <img src="images/image_01.jpg" width="1024" height="212" alt=""></td> </tr> <tr> <td> <a href=http://www.goldgaming.bravehost.com><img src="images/image_02.jpg" width="287" height="96" alt=""></td></a> <tr><td style="background-image: url('images/image_03.png');"><img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyNjQzNjkyMTY1OTMmcHQ9MTI2NDM2OTI4NzEwOSZwPTUzMTUxJmQ9Jmc9MSZvPTkwYTllY2MyMzg1YjQyOTU5ZDVi/ZmQyZWM2MDA2YmRl.gif" /><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="540" height="405" name="chat" FlashVars="id=82923250" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /><br><small><a target="_BLANK" href="http://xat.com/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://xat.com/web_gear/chat/go_large.php?id=82923250">Go Large!</a></small><br> </tr> </td></tr> </tr> <table id="Table_01" width="1024" height="768" border="0" cellpadding="0" cellspacing="0" style="float: left;"> <tr> <td> <img src="images/image_04.jpg" width="287" height="95" alt=""></td> </tr> <tr> <td> <img src="images/image_05.jpg" width="287" height="85" alt=""></td> </tr> <tr> <td> <img src="images/image_06.jpg" width="287" height="105" alt=""></td> </tr> <tr> <td> <img src="images/image_07.jpg" width="287" height="127" alt=""></td> </tr> <tr> <td colspan="2"> <img src="images/image_08.jpg" width="1024" height="48" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> </body> </html> It would mean so much if you can redo the code or atleast help me out, thanks guys, I appreciate it ALOT. Hi, I have a website which runs primarily on html, but I call some dynamic content using <?php include 'list.php' ?> inside the body tag of index.html. <html> .... <body> .... <?php include 'list.php' ; ?> ... </body> </html> The domain is redirected to public_html/myproject (index.html and list.php is present here). Now only the html shows up. The php content is not included. (the list does not show up, works fine in local machine) How do I include php on html files? What changes should I make? 1. I tried adding a .htaccess in the myproject folder with the content AddType application/x-httpd-php5 .html .php AddHandler application/x-httpd-php5 .html But it throws a 500 error. 2. Should I make any changes to php.ini file? [ There is no php.ini file in the sub directory as of now. Is it required? ] 3. I also tried adding a apache handler in the bluehost control panel, but in vain. Desperately in need of a solution. Appreciate any quick response, Thanks http://boosterbath.com Help please, I am making a website, and i have a problem. I have a page that when opened in Safari and when you try to open it on firefox it doesnt work and comes up with: ��<�h�t�m�l�>� � �<�h�e�a�d�>� � �<�t�i�t�l�e�>�P�l�a�n�e� �C�o�l�o�u�r�i�n�g� �I�n�d�e�x�<�/�t�i�t�l�e�>� � �<�m�e�t�a� �h�t�t�p�-�e�q�u�i�v�=�"�C�o�n�t�e�n�t�-�T�y�p�e�"� ... It is based on another page I have made, which works fine but this one seems to not want to |