14 replies [Last post]
dave001
Offline
newbie
Last seen: 13 years 31 weeks ago
Joined: 2009-02-26
Posts: 3
Points: 0

I currently have two ad gutters on the sides of a page. It works fine in IE 7 but not in IE 6 or firefox. In IE 6 both ad banners are positioned in the center. each gutter is enclosed in a div block.

Here is the code.

Any help or suggestion will be helpful.

Thanks

<script language="javascript" type="text/javascript">  
var objAd = new clsAd('divAdGutterLeft', 'http://ad.doubleclick.net/adi/' + dcsite + '/' + 
dczone + ';page=4000001;sel=0;sel2=0;pos=top;sz=120x600;tile=' + dctile + ';ord='+dcord+'?', '160', '600');  
ary[10] = objAd;  var objAd = new clsAd('divAdGutterRight', 'http://ad.doubleclick.net/adi/' + dcsite + '/' + 
dczone + ';page=4000001;sel=0;sel2=0;pos=top;sz=120x601;tile=' + dctile + ';ord='+dcord+'?', '160', '601');  
ary[11] = objAd;  </script>  
 
<span style="font-weight:bold"><div id="divAdGutterLeft" style="position:absolute;top:200px;padding-left:50%;margin-left:-60px;height:600px;width:120px;"></div>  
 
<div id="divAdGutterRight" style="position:absolute;top:200px;padding-left:50%;margin-left:1050px;height:601px;width:120px;"></div></span>

Titan793
Offline
Enthusiast
Syracuse, NY
Last seen: 11 years 45 weeks ago
Syracuse, NY
Timezone: GMT-5
Joined: 2009-02-20
Posts: 285
Points: 5

I'm assuming you have a

I'm assuming you have a content DIV that goes in between those? So in essense, it's a 3 column layout?

Wouldn't it be easier to just float the DIVs?

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

yes use float option to take

yes use float option to take them to left and right. position: absolute is creating a problem for you. so its better to use floating technique.

dave001
Offline
newbie
Last seen: 13 years 31 weeks ago
Joined: 2009-02-26
Posts: 3
Points: 0

I tried rewriting it to use

I tried rewriting it to use float instead, but this doesn't seem to work correctly either.

Thanks

<div id="divAdGutterLeft" style="float: left;margin:200px 0px 0px 5px;height:600px;width:120px;"></div> 
 
<div id="divAdGutterRight" style="float: right;margin:200px 5px 0px 0px;height:601px;width:120px;"></div> 

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

show me live link or paste

show me live link or paste your complete code here.

Titan793
Offline
Enthusiast
Syracuse, NY
Last seen: 11 years 45 weeks ago
Syracuse, NY
Timezone: GMT-5
Joined: 2009-02-20
Posts: 285
Points: 5

This won't be using your div

This won't be using your div names or anything.. but you'd want to put your 2 gutter divs and your content one in a container div. That container div should have it's width set to the total width of the divs inside it.

Try something like:

test
test

I tested that very quickly and it does work.. that should be something to start with anyway once you change names/dimensions/content/etc.

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

try this. <div

try this.

test
test

Titan793
Offline
Enthusiast
Syracuse, NY
Last seen: 11 years 45 weeks ago
Syracuse, NY
Timezone: GMT-5
Joined: 2009-02-20
Posts: 285
Points: 5

xeeshan wrote:try

xeeshan wrote:

try this.

test
test

That looks somewhat familiar.. same dimensions, div id's, and "test" in each div even lol.. were you supporting my post or basically stealing it lol?

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

have you tried it the same

have you tried it the same way i did it. do one thing. send me a screen shot of your page. coz right now i am just guessing it. take a screen shot and upload it at imageshack.us and show me. lol i am not stealing it Smile

Titan793
Offline
Enthusiast
Syracuse, NY
Last seen: 11 years 45 weeks ago
Syracuse, NY
Timezone: GMT-5
Joined: 2009-02-20
Posts: 285
Points: 5

xeeshan wrote:have you tried

xeeshan wrote:

have you tried it the same way i did it. do one thing. send me a screen shot of your page. coz right now i am just guessing it. take a screen shot and upload it at imageshack.us and show me. lol i am not stealing it Smile

I don't really have the time to sign up for an imageshack account, take a screenshot of something I tested in notepad, and upload it to show you, as I'm at work right now..

Although, the odds of you asking for complete code before you would help, and then coming up with something almost identical to my post 10 seconds after I posted it.. is not good.

The odds that you would have the same dimensions, the same test words, the same div id's, and the same style declarations (with the addition of 2 margins that aren't needed) is probably the same as winning a scratch off lottery ticket..

I guess it's not the end of the world, but I have a hard time believing that it's purely coincidental.

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

first of all if you think

if its a copy right issue then m sorry for it.
one more thing. i didnt know that you are answering to someone\s post. i thought you are asking thats why i showed you your code with some change. i thought you are the one who posted this topic. my mistake. and m sorry once again. have fun.

Titan793
Offline
Enthusiast
Syracuse, NY
Last seen: 11 years 45 weeks ago
Syracuse, NY
Timezone: GMT-5
Joined: 2009-02-20
Posts: 285
Points: 5

xeeshan wrote:if its a copy

xeeshan wrote:

if its a copy right issue then m sorry for it.
one more thing. i didnt know that you are answering to someone\s post. i thought you are asking thats why i showed you your code with some change. i thought you are the one who posted this topic. my mistake. and m sorry once again. have fun.

Oh no, no copyright issue lol.. Now I see where the misunderstanding is! I didn't realize you thought you were answering a question that I asked! I don't think you need the margins on the content div though.. when I wrote that, it worked fine without it.

Ok, I have to go home.. thank god work is over! It all makes sense now! Smile

xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

well you are right about

well you are right about margins. but there is one issue you will get if you wont place your div's in that order which i showed you. i saw a strange behavior. that if you put divs like

it put some margin to the right div from top. you will see if you will put more contents in right div as compared to other two divs. so when i changed the order and put left right center, then it worked. Strange thing but this way it worked for me.

have a good time at home.
c ya

dave001
Offline
newbie
Last seen: 13 years 31 weeks ago
Joined: 2009-02-26
Posts: 3
Points: 0

I appreciate all the help,

I appreciate all the help, however I still have a problem with it.

I have attached a screenshot of showing the problem with positioning. The content page seems to be pushed below the gutters instead of appearing in between. I was thinking that since am floating the gutters this should not be so.

The page components code are retrieved seperately from db and loaded dynamically to form the page. So in the case I am just working on the gutters portion. Do I have to change the content portion to float or modify the values too, thx.

Thanks

AttachmentSize
untitled1.GIF 45.42 KB
xeeshan
Offline
Regular
Last seen: 13 years 29 weeks ago
Joined: 2009-02-26
Posts: 38
Points: 0

hi dave. there is one

hi dave. there is one possibility that you are facing this problem. the width of your middle container is bit larger than it should have. try to reduce the width of middle container and then check. it would be better if you show me a live link so i can look at it.

suppose you have

then if you have contents in your middle div which are occupying more than 600px , suppose even 602px , then it will go underneath left and right div. i had this issue and i found this conclusion. may be there would be some other issue for you. but may be this would help you. do one thing. just put some text in middle div instead of putting data dynamically, just to test it.