HTML - Ie6/ie7 - Ads Stay In Place When Resize Browser
I am having a very frustrating issue that seems to have crept up over the last month or so. This problem did not exist on my site before, but it certainly exists now.
Whenever I resize IE6 or IE7, the Google Ads I use on my site stay in place instead of following the browser resize shift. Needless to say, this makes the site look horrible when someone resizes their browser. And the real kicker is I haven't changed this section of code in months and now its suddenly not working. However, I have started using some other ads that use an <iframe> tag, and those ads do not have this issue. I know that Google uses javascript to serve the ads. Could there be some strange interaction between my code and Google's code? Has anyone else run into this? If so, how did you solve it? Here is a sample of my code that has this problem: Code: <div id="adPad"> <div class="floatArea1" style="margin:0 5px 0 0;"> <div class="noBorder"> <a href = "URL"><img src="img/image.png" alt="ALT" width="x" height="y"/></a> </div> </div> <div class="floatArea1" style="width:728px; height: 92px; margin: 0 0 5px 0;"> GOOGLE AD GOES HERE </div> </div> relevant CSS: Code: #adPad{width:955px; padding:5px;} .floatArea1{ float:left; margin-left: 10px; font-weight: normal; width: auto; padding: 0px; display: inline; overflow: hidden; } .noBorder { float: left; width:auto; } .noBorder img { border: 0px; /*width: 312px; height: 90px;*/ overflow: hidden; } Any help on this is greatly appreciated! Thanks! Similar Tutorialshi i have built two pages using DW, an INDEX page and a FORM page. They both contain divs. I want to have the FORM page appear in the MAIN CONTENT div of the INDEX page. I got that to work, however the problem is the Form itself does not stay in the Div it is placed in, it floats out under the DIv and on top of other content. thanks for the help - my code is too long to post in one thread - will post the index code in part two here is the FORM code: 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" /> <title>Untitled Document</title> <style type="text/css"> <!-- * { margin: 0px; padding: 0px; } body { } img { } h1 { } h2 { } h3 { } #retailWrapper { height: 540px; width: 980px; } #retailWrapper #retailHeader { height: 50px; width: 980px; float: left; } #retailWrapper #leftImage { float: left; margin-top: 10px; clear: none; } #retailWrapper #form { height: 400px; width: 680px; margin-top: 10px; padding-top: 10px; float: left; } .style1 {font-family: Arial, Helvetica, sans-serif} .style19 {font-size: 12px} .style21 {font-size: 16px} .style23 {color: #000000} .style25 {color: #FFFFFF} .style27 {color: #BEBEBE} .style29 {font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; } .style30 {font-size: 14px} .style31 {font-family: Arial, Helvetica, sans-serif; font-size: 14px; } --> </style> </head> <body> <div id="retailWrapper"> <div id="retailHeader"><img src="_Art Files/newRetailerInq.gif" width="980" height="51" /></div> <div id="leftImage"><img src="_images/_galleryImages/retailDisplay.jpg" width="200" height="480" /></div> <div id="form"> <form id="form1" name="form1" method="post" action=""> <table width="51%" align="center" cellpadding="8" cellspacing="6"> <tr> <td width="131"><div align="right" class="style29"> <label for="name">Name:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="name" id="name" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="storeName">Store Name:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="storeName" id="storeName" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="addressLine1">Address Line 1:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="addressLine1" id="addressLine1" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="addressLine2">Address Line 2:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="addressLine2" id="addressLine2" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="city">City:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="city" id="city" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="state">State:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="state" id="state" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="zip">Zip:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="zip" id="zip" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="email">Email:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="email" id="email" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="phone">Phone:</label> </div></td> <td width="196"><div align="left" class="style31"> <input type="text" name="phone" id="phone" /> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="comments">Comments:</label> </div></td> <td width="196"><div align="left" class="style31"> <textarea name="comments" rows="4" id="comments"></textarea> </div></td> </tr> <tr> <td width="131"><div align="right"><span class="style1"><span class="style19"><span class="style21"><span class="style23"><span class="style25"><span class="style27"><span class="style30"></span></span></span></span></span></span></span></div></td> <td width="196"><div align="left" class="style31"> <input type="checkbox" name="subscribe" id="subscribe" /> <label for="subscribe">Subscribe newsletter</label> </div></td> </tr> <tr> <td width="131"><div align="right" class="style29"> <label for="reset"></label> <input type="reset" name="reset" id="reset" value="Reset Form" /> </div></td> <td width="196"><div align="left" class="style31"> <label for="submit"></label> <input type="submit" name="submit" id="submit" value="Submit" /> </div></td> </tr> <tr> <td width="131"><div align="right"><span class="style1"><span class="style19"><span class="style21"><span class="style23"><span class="style25"><span class="style27"><span class="style30"></span></span></span></span></span></span></span></div></td> <td width="196"><div align="left"><span class="style1"><span class="style21"><span class="style30"></span></span></span></div></td> </tr> </table> </form> </div> </div> </body> </html> Can someone show me how to make a background stay still when you scroll up and down the page? Hi all, I notice that on some websites when you minimize and maximize the window, the content on the site displays differently. For example if i reduce the browser window on this website - all content is still displayed as if it were open in a fully maximised window. What is this called? and How do you do it?? Cheers Raggy Hi, I'm building a web site for someone. At the top of the page is the logo and some flowing lines going from left to right on screen. If you look he http://www.chrisvanochten.com/clients/voicecontrol/ and start resizing your browser window then you would see the content at the bottom moves along so that it is always in the center. The problem I have is that the image on the top will not do this. This is because it's a background image. I want the image to be positioned so that the logo is above the latest news section. I have tried using a normal image and aligning it to the center (scroll down on the page above for this) but the image is always anchored to the left of the screen if the image is larger than the browser window. Is there anyway to set the background image so that it is anchored in position and that it will run off both the left and right hand side of the screen (as opposed to just the right hand side)? An html noob would like some help. I am making a html page to autorun from a CD-ROM. I would like the browser window on the users computer to open to a fixed size. I tried the following html inserted into the body of my code. Code: onload="self.resizeTo(795,470)"> This works well in Internet Explorer but when I try it with Firefox 3.0.1 the script seems to make the toolbars and scrollbars be included in the size. That is, the interior of IE window displays the content at the right size (795 x 470) with no space between the content and the scroll bars etc., but the whole of the firefox browser program (toolbars, scrollbars etc shrink to 795 x 470). This makes it necessary to scroll the content in Firefox. I would like to only use html for the solution as I am trying to keep the CD-ROM requirements to run to a minimum. Also if there was someway to make the scroll bars and toolbars disappear from the browsers this would improve the professional look. I am sure there is an easy answer, but I can't find it. Thanks for any help. Problem: When ever i place the image the menu messes up. Please look at the first picture below to see the problem Now look at the second picture below to see how i want it to be source code: <html> <head> </head> <body> <img src="Home.jpg" width="190" height="30"><br/> <img src="Downloads.jpg" width="190" height="30"><br/> <img src="Hacks.jpg" width="190" height="30"><br/> <img src="Media.jpg" width="190" height="30"></br> <img src="Information.jpg" width="190" height="30"> <img src="Linux-logo.jpg" width="200" height="200"> <br/> <img src="Disclamier.jpg" width="190" height="30"><br/> <img src="Links.jpg" width="190" height="30"> <br/> </body> </html> I have listed items inside a div that display just find in FF v3.0.1, but not in IE v7. Here is the link to my page. http://web.missouri.edu/~mdsybf/ Here is the CSS of a class div that surrounds the previously mentioned div. .MainEdit { clear:both; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; color: #000000; text-decoration: none; float: left; padding-right: 10px; padding-left: 10px; padding-bottom: 10px; padding-top: 10px; margin-left: 10px; width: 700px; clear: right; display: inline; vertical-align: top; height: auto; } What is wrong with my code that makes the listed items appear outside the div box? Hello lady's and gentelmen.. I have a really short question (almost so small it's not even worth waste a whole thread on it!) But, here it goes When I go to my homepage: www.sp34k.dk and maybe select "blog", then I can see the link "www.sp34k.dk/blog.htm" and if it go to billeder (picture) then its www.sp34k.dk/billeder.htm. Are there any possibility for that I can do such it dosent change? So it would ALWAYS stay as "www.sp34k.dk"? Kind regards Mike Bertelsen Denmark I'm using NVU. I've got code that was generated by Omnipage - it is full of boxes and divs and spans which I don't understand yet. Anyway I'm doing alright except when I put a line of links (forward,back,index,main) in at the bottom of each of these pages, above the bottom-of-the-page 'credits', I find I can't keep them separate. I put a few carriage returns in and there's some clear space - four or five lines or more - between them. I save the file, close the file, pick the file up again and look at it and they've closed up again! Dreamweaver doesn't seem to be able to sort it out, either. You can see the pages and their code at mbccc.net and follow the 'parent information' link. regards, ab Hi there, I am currently making an iPhone/Touch website, and would like to know how I can make it so the top banner stays at the top, while the main body of the site scrolls up and down below it. Can you help? Josh For some reason when there is little content on the page, the layout doesn't remain centered. What can I do to fix this? Here is the link to my website: Check out the difference between about and knowledge http://www.organicgardencafe.com/about.php Hope the title made sense, I am using Microsoft Expression Web and, I am also using Frames on my website. I have 3 Frames, One complete at the top, one on the left side and then a main page frame to fill the rest. I am using a 19" wide screen monitor, and because of that the pages I make are all unaligned with each other as they get stretched to fill the monitor. now the top frame and left frame stay where they should I have done that, but I can't keep the main page frame from moving over to the right and making everything look untidy and nasty. so could anyone help me out with this problem please, I use a background Image, text and images on the page so they all need to stay centered bu to the left of the page. Or maybe center all the frames to the middle of the screen such as www.myspace.com looks on a wide screen monitor (although i know they do not use frames.) Thanks in advance How do I make a table with a fixed width stay centered even if the browser window's horizontal size is smaller than the table's horizontal size? align="center" makes the table centered as long as the browser window is bigger than the table. If the browser window is smaller, the table will be cropped on the right size only, not on both size. I would like to do this to have a table with a fixed width and a background image, so that no horizontal scrolling bar appears if the screen resolution if too small for the table. The image should howerver stay centered no matter what the windows size is. Thanks. Hi there, Not sure if this is HTML or CSS - I've got a <ul> menu that I've set up and it's changing nicely in colour when you mouseover (using a:hover etc.) I've seen a few menus though where if you click on home, it loads home and that option stays a different colour to show you what page you're currently on.. any ideas? I'm working on my new site and my next step is to figure out how to make a cell stretch to the width of a page regardless of the size. I'm not sure what this is called. Here is the site. Let's just use the yellow menu bar for an example. I need to make it stretch to the right of the page. http://C-41productions.com/C-41_2008 Thanks so much. Hi Guys, How can i make my footer stay at the bottom of the page so when the user holds down ctrl and zooms out i want to the footer to stick to the bottom of the screen, i have done this before but i cant remember for the life of me and its actually killing me know can someone put me out of my misery please. heres the HTML and CSS its called BottomBanner HTML Code: <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %> <!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 runat="server"> <title>Vodafone One Net Express</title> <style type="text/css"> body{background: none repeat scroll 0 0 #F4F4F4; margin:0px !important; padding:0px !important;} .PageSetter{margin-left:auto; margin-right:auto; margin-top:-2.3%; background: none repeat scroll 0 0 #F4F4F4; position:relative; } .TopBanner{background-color:#C51906; width:100%;height:80px;} .TopBanner h1{font-size:2.7em; text-align:center; color:White; margin-left:auto; margin-right:auto; padding-top:15px; font-weight: normal; width: 600px;} .BottomBanner{background-color:#C51906; width:100%;height:80px; margin-bottom:-0.1% !IMPORTANT} .BottomBanner h1{font-size:2.3em; text-align:center; color:White; margin-left:auto; margin-right:auto; padding-top:15px; font-weight: normal; width: 600px;} .IframeContiner{width:980px; margin-left:auto; margin-right:auto; margin-top:10px} .IframeStyle{Width:982px; height:1000px; border:0px} </style> </head> <body> <div class="PageSetter"> <div class="TopBanner"> <h1> Vodafone One Net Express </h1> </div> <div class="IframeContiner"> <iframe scrolling="auto" class="IframeStyle" src="http://www.telegraph.co.uk/finance/yourbusiness/businesstechnology/9209385/Review-Vodafone-One-Net-Express.html"> </iframe> </div> </div> <div class="BottomBanner"> <h1> Call Now 0800 1980 000 </h1> </div> </body> </html> Hi all, If you go to http://kvc.dk/CTC7/index.htm Press "ctc-info" in the top menu you goes to a page with an iframe and links on top. When you press these links i want the current link to stay active until you press on another link. I have tried this: http://forums.htmlhelp.com/index.php...ndpost&p=38645 But i cant get it to work. Heres the code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/> <title>CTC</title> <link rel="stylesheet" type="text/css" href="../stylesheet.css"/> </head> <body> <table border="0" width="950" cellspacing="0" cellpadding="0" height="500"> <tr> <td align="right" bgcolor="#000000" valign="top" style="padding-right: 10px; padding-top: 70px" background="../images/Frontimages/ombygning.jpg"> <table border="0" width="500" cellspacing="0" cellpadding="0" > <tr> <td style="border: 2px solid #FFFFFF"> <table border="0" width="100%" cellspacing="0" cellpadding="0" background="../images/hvidbg.png" > <tr> <td style="padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:14px"> <a target="menu" href="Text/CTCinfo/omctc.htm">Om CTC</a> | <a target="menu" href="Text/CTCinfo/ansatte.htm">Ansatte</a> | <a target="menu" href="Text/CTCinfo/samarbejdspartnere.htm">Samarbejdspartnere</a> | <a target="menu" href="Text/CTCinfo/dopingpolitik.htm">Dopingpolitik</a> | <a target="menu" href="Text/CTCinfo/job.htm">Job</a> | </font><a target="menu" href="Text/CTCinfo/downloads.htm"> Downloads</a></td> </tr> <tr> <td> <iframe name="menu" src="Text/CTCinfo/omctc.htm" width="500" height="329" frameborder="0" allowtransparency="true" background-color="transparent"></iframe> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </body> </html> Hi, I have a framed page, two frames, a small top frame with a drop-down menu, the drop down menu are links to external pages, the external links are displayed within the lower frame. I have everything set up and working fine, but then I had to find a little "snag"...(of course) When I browse within the lower window (clicking links on the pages displayed in the lower window) some links override my frames and open up on top of my framed site. So my question is: Is there a way to make my frames "absolute" (stay on top nomatter what), that is, all links within the lower frame will be opened up within the frame and not on top? (bare in mind that these are external pages and I do not control the nature of the links such as target tags etc.) I have my code here... INDEX: Quote: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE></TITLE> </HEAD> <frameset rows="35px,*" frameborder="0"> <frame name="menu" src="dropdown.html" scrolling="no" noresize> <frame name="content" src="blank.html"> </frameset> </HTML> DROPDOWN.HTML Quote: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE></TITLE> <base target="content"> <script language="javascript" type="text/javascript"> <!-- function menu_goto( menuform ) { var baseurl = "" ; selecteditem = menuform.newurl.selectedIndex ; newurl = menuform.newurl.options[ selecteditem ].value ; if (newurl.length != 0) { parent.content.location.href = baseurl + newurl ; } } //--> </script> </HEAD> <BODY topmargin="2" leftmargin="2"> <form action="dummyvalue"> <select name="newurl" onchange="menu_goto(this.form)"> <option value="" selected="selected">----- Choose a link -----</option> <option value="http://www.sitenumber1.com">first link</option> <option value="http://www.sitenumber2.com">second link</option> </select> </form> </BODY> </HTML> any suggestions? hello everyone. I'm a newbie at this HTML stuff. I've made my first webpage and everything is working fine. I added some .SWF files and placed them where I wanted using <div> coding. My problem is whenever you resize the browser window, the flash movies move with it, they "float" over the rest of the page. How do I make them stay static when you resize the window? Could someone please help me with this problem? I appreciate it very much. Hey everyone, I feel like this is a noob question, but I'm going to ask anyway. How do write my site so that my body stays in the same place and doesn't smash together when I manually resize my page? Any help is greatly appreciated. Thanks |