BeFreebies Posted November 27, 2012 Share Posted November 27, 2012 I have been strugling with the same problem for a few days now and I am about to give up. I have a website from a template and I am trying to insert vertical banners into the site (http://www.befreebies.com) and the only way I could figure out how to do that was with the code listed below, but when I resize the browser window the vertical banners float on the page, usually exactly over something I don't want to cover. I have googled and fiddled for days and I don't want to sound lazy... but is there anyone who can tell me if there a way to do this with CSS that that tells it to change its size and position on the page if I resize the screen? Thanks in advance. <DIV ID="Banner" style="visibility:hidden;position:absolute;top:250px; left:1245px"> <script type="text/javascript"><!-- google_ad_client = (((my banner goes here))) </div> Thanks. Quote Link to comment Share on other sites More sharing options...
NomadicJosh Posted November 27, 2012 Share Posted November 27, 2012 I see that you are using "float" for some of your "div" elements. Would "float:left" not work instead of "position"? Quote Link to comment Share on other sites More sharing options...
BeFreebies Posted November 27, 2012 Author Share Posted November 27, 2012 I am sorry -- I have struggled with this for days but I do not really understand it. As I said, this was a template and I have managed to botch it up pretty good. Most of everything on that page is from the original template. I personally added the code to add the ad banners a few days ago and have tried almost nonstop to get them to work. I have tried many different things. Are you saying I should use float:left instead of "position"? Quote Link to comment Share on other sites More sharing options...
NomadicJosh Posted November 27, 2012 Share Posted November 27, 2012 (edited) Yes, I would edit the first part of each like so: <div class=banner> Then in your css add (you may need to adjust the margins to get it to sit where you want it): .banner { float:left; margin:100px 10px 0px 10px; } It's hard to read your html code, but I think your first banner code should come before: <div id=wrapper> And the second banner code should come after the closing </div> for "wrapper". Edited November 27, 2012 by parkerj Quote Link to comment Share on other sites More sharing options...
BeFreebies Posted November 27, 2012 Author Share Posted November 27, 2012 Thank you so much for the help. I changed it, I think like you suggested, and where the left banner sits is perfect, but it seems to push down the remainder of the page. How do I tell it not to do that? (thanks again) Quote Link to comment Share on other sites More sharing options...
NomadicJosh Posted November 27, 2012 Share Posted November 27, 2012 Oh, sorry. I forgot to mention that you will need to calculate the width and make adustments. The width, margins and padding of .banner and the wrapper must not exceed the overall width of the section. However, I can't determine what that width is. This is why the main section is being push down. Quote Link to comment Share on other sites More sharing options...
BeFreebies Posted November 27, 2012 Author Share Posted November 27, 2012 Okay - thank you for your help. I don't know how to find it but at least I know what I am looking for thanks to your help. Quote Link to comment 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.