HTML - Banner Table Margin Problem
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> Similar TutorialsI have a few sites. The one I'm working on now is giving me trouble and I really can't understand why. I just started it so it's mainly templates and stuff, but the banner at the top is made out of many img files put into a table. I've done this technique before and it worked fine but for some reason it will not work on this site. Basically I am getting a large white line through the top and bottom rows of images. Please help. Link to my site where the banner works: http://www.stevemedleyphotography.com Link to the site I started where the banner is not working: http://www.desyriarpg.com iv been trying to make a header for a new ebay store. i have dream weaver with a table with 1 row and 2 col in the first column i have the main logo and 3 hotspot buttons, in the 2nd column i have a solid colour image set as the background for that row. the problem i am having is the 1st column with the logo image has a white space under the image which looks very annoying html code below: <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td width="1200" height="292"> <img name="MainHeader" src="http://imagehost.vendio.com/a/35060807/view/MainHeader.jpg" width="1200" height="292" border="0" id="MainHeader" usemap="#m_Main20Header" alt="" /> <map name="m_Main20Header" id="m_Main20Header"> <area shape="poly" coords="810,21,964,21,964,55,810,55,810,21" href="javascript:;" title="Terms And Conditions Page" alt="Terms And Conditions Page" /> <area shape="poly" coords="990,21,1144,21,1144,55,990,55,990,21" href="javascript:;" title="Email Us Page" alt="Email Us Page" /> <area shape="poly" coords="630,21,784,21,784,55,630,55,630,21" href="javascript:;" title="About Our Company Page" alt="About Our Company Page" /> <area shape="poly" coords="450,21,604,21,604,55,450,55,450,21" href="javascript:;" title="Frequently Asked Questions Page" alt="Frequently Asked Questions Page" /> </map> </td> <td background="http://imagehost.vendio.com/a/35060807/view/headerbg.jpg" width="845" height="292" border="0"> </td> </tr> </table> I am trying to get my banner to work and I have run out of options. I have 2 examples here the top one is the one I am having problems with and the bottom one is one that works and is the one I used as an example to get the code right. or click on this banner.<P> <a href='http://images.startxchange.com/o/onelady-banner1.png '><br /> <img border='0' src='http://www.startxchange.com/?referer=onelady' /></a> or click on this banner.<P> <a href='http://webcentresurf.com/?20191'><br /> <img border='0' src='http://webcentresurf.com/banners/surf_a1.gif' /></a> I am very new at this and would appreciate any help getting my banner to work correctly. Thanks in advance, Leah Jesse bjr 2 created a site ac XHTML / CSS Oh sorry, here is no Sms :p Hello =) I try to create a site with XHTML / CSS, for now, I'm doing pretty good! No luck, to insert the banner hangs her: / I insert this code: Citation Code: <Div id = "<img src="images/hawai.jpg" alt="Photo Hawaii" /> <! - Here we put the banner -> </ Div> <div id="menu"> <! - Here we will put the menu -> </ Div> <div id="corps"> <! - Here we put the main content of the page (all text what) -> </ Div> <div id="pied_de_page"> <! - Finally, we will down the page the name of the author, copyright ... -> </ Div> (Example teo21 @ m) But nothing happens! So, hoping you can help me: / Regards! Hi everyone. I'm part of the 1&1 web hosting affiliate scheme. As part of this I display a banner on my website which when clicked and and account is signed up for, I get commission on the sale. Anyhow, the banner displays fine in IE7 but will not display in any version of Firefox. Here's the code. Code: <a href=" http://1and1.co.uk/xml/init/?k_id=15923576 " target=" _blank "> <img src=" http://banner.1and1.co.uk/xml/banner?size=6&number=1 " style=" margin=left:5px;width:140px;height:28px;border:0; " alt=" 1and1 Banner " /></a> Does anyone have an idea why this is the case? 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 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 Hello, I am newbie, just has started my adventure with html. I tried to make an easy static site, without any additional thingd, but it occured a problem. 1. I mean, as I put table in table because I did know how to to id in different way, to make buttons on the left stay up while text on the right is moving- if I do normal table with 2columns and on the left lets say 5rows for buttons, on the right I unite all rows to make one big sort of box for contents, as I go down and try to write something morre, the rows from the letf were enlarging too If the size of explorer or firefox is nor full screen, the text in contents is going away (like now in lycos server, where screen is not full, but "cut" by advertise) 2. I have highlighted buttons, but not always works, why? (i mean it works, but darker buttons are charging so slow- maybe it is so because i saved them in pgn instead in gif, and each one is about 50kb?) -probably it is not this- because I have just changed into gif, and it is still the same 3. Another problem, as I post the site, I have notice, that in firefox I can not navigate with buttons, while in explorer yes, is it a fault of my coding, or of server where I put website? Here I post my website: http://members.lycos.co.uk/aniaacolgate/ Could someone take a look on the code, and will be so kind to correct me? It is a basic easy site of very begginger I just wanted to make a shape like this: - top: a banner - buttons in horizontal and vertical way - under buttons: contents (sincerly would like to put frames, but do not know how to put them there, is on the left there r buttons Thank you so much in advance for reply Sorry for mistakes in language My site is: h1.ripway.com/shsepac How can I make the banner so there is no space at the top and at the bottom? Hey, i have a problem with my banner(logo) I want the banner to be at the top, not underneath it. I want it to be centered and at the top, stuck to the border or something, like at http://habblogg.net, here is my site http://habbxtra.net Please help anyone Hi everybody I am a new member. I'm not to experienced with css style sheets or html and have a small problem. I have attached code. My website is www.intelligentstudentfinance.com I want to move the banner at the bottom of the financial aid page to the extreme right but not sure what the code is. I have attached the code in txt format and commented the banner I want want moving to the right. Look forward to your replies Thanks I'm trying to set the following banner up on my site but when I paste the code at the end of the page the banner keeps appearing at the top of the page. Can anybody explain why? <div style="z-index: 110; position: absolute; width: 468px; font-family: arial,sans-serif; background: url("http://outils.acf-webmaster.net/bann...2482.gif") repeat scroll 0% 0% transparent; height: 60px; color: rgb(255, 255, 255); font-size: 12px; top: 26px; left: 34px;"> <div style="position: absolute; line-height: 110%; width: 200px; top: 1px; left: 55px;"> <font xmlns="http://www.w3.org/1999/xhtml"><font xmlns="http://www.w3.org/1999/xhtml"> <font size="1px;"> <strong> <font face="Verdana"> 280 different <a style="color: rgb(255, 255, 2); font-size: 10px;" href="http://www.casinoriva.com/en/" target="_blank">online casino</a> games await for you. </font> </strong> </font> </font></font></div> </div> Hi... In some time I have tried to figure out how to put a banner underneath the red ruler in my myspace profil. I have onlly been able to find a code for putting it on the very top of the site as you kan see on my page: Kasper I would like to have it underneath the red ruler just like it is on this site: www.myspace.com/theasteroidsgalaxytour Does anyone know the code I should use or what I should do? Kasper P.S. Hope you like my music. okay probably a simple feat for some of you, but if I wanted to make a nbanner that flitted (rotated) through several images, say four location shots, how does one do this? I do have in my employ: Adobe Photoshop Adobe Dreamweaver and my favorite coding program : Notepad Do I make an animation in Photoshop and save it as a ,gif and use that in Dreamweaver and add the link there? Would that work? hrm. *pulls her skirt down a bit* I think my noob is showing hey can someone please help i am having trouble with adding a banner when i just to add it the picture does not show what could i be doing wrong??? |