Be a Supporter!
Thegluestickman
Thegluestickman
  • Member since: Mar. 16, 2007
  • Offline.
Forum Stats
Member
Level 13
Game Developer
Css Vertical Banner 2012-11-26 20:19:57 Reply

http://gluestickman.co.nr

So I have two horizontal banners (don't mind them, they're just tests) and they stay where I want them to. The main problem is that when you make the window smaller the banners overlap the text which is not good. I know it has to do with my position rule in my CSS, I have set it to absolute to keep it stuck to the side. Any other positioning other than fixed (which has the same issue) will push the main content down below the picture.

Is there anyway to stick the image to the side without it messing up on minimization or pushing the main content down?


To protect the world from devastation.
kidd25 is the best Newgrounder ever.

BBS Signature
Pilot-Doofy
Pilot-Doofy
  • Member since: Sep. 13, 2003
  • Offline.
Forum Stats
Member
Level 37
Musician
Response to Css Vertical Banner 2012-11-26 20:40:26 Reply

At 11/26/12 08:19 PM, Thegluestickman wrote: http://gluestickman.co.nr

So I have two horizontal banners (don't mind them, they're just tests) and they stay where I want them to. The main problem is that when you make the window smaller the banners overlap the text which is not good. I know it has to do with my position rule in my CSS, I have set it to absolute to keep it stuck to the side. Any other positioning other than fixed (which has the same issue) will push the main content down below the picture.

Is there anyway to stick the image to the side without it messing up on minimization or pushing the main content down?

Have you tried the float property? You can always use margins and z-index to keep it where you want. If you want to use z-index you will need to set the position to relative, though.

smulse
smulse
  • Member since: Mar. 24, 2005
  • Offline.
Forum Stats
Member
Level 31
Blank Slate
Response to Css Vertical Banner 2012-11-27 13:19:47 Reply

Just give #rightBanner #leftBanner

position: absolute;

And remove the floats on them? :)


BBS Signature
smulse
smulse
  • Member since: Mar. 24, 2005
  • Offline.
Forum Stats
Member
Level 31
Blank Slate
Response to Css Vertical Banner 2012-11-27 13:40:47 Reply

Oh, sorry I misunderstood, I see when you do what I mentioned the content overlaps.

See this for solution


BBS Signature
Thegluestickman
Thegluestickman
  • Member since: Mar. 16, 2007
  • Offline.
Forum Stats
Member
Level 13
Game Developer
Response to Css Vertical Banner 2012-11-27 17:10:31 Reply

At 11/27/12 01:40 PM, smulse wrote: Oh, sorry I misunderstood, I see when you do what I mentioned the content overlaps.

See this for solution

Hey that works great! Thanks man.

Say, if I wanted the banners placed their statically (the right banner doesn't follow the window) is there any solution for that? Just to see if that looks better or something.


To protect the world from devastation.
kidd25 is the best Newgrounder ever.

BBS Signature
smulse
smulse
  • Member since: Mar. 24, 2005
  • Offline.
Forum Stats
Member
Level 31
Blank Slate
Response to Css Vertical Banner 2012-11-27 17:17:45 Reply

At 11/27/12 05:10 PM, Thegluestickman wrote: Say, if I wanted the banners placed their statically (the right banner doesn't follow the window) is there any solution for that? Just to see if that looks better or something.

In this case I would be tempted to do the banners as background images, so you could just do

background-position: fixed;

BBS Signature
Thegluestickman
Thegluestickman
  • Member since: Mar. 16, 2007
  • Offline.
Forum Stats
Member
Level 13
Game Developer
Response to Css Vertical Banner 2012-11-27 17:19:26 Reply

At 11/27/12 05:17 PM, smulse wrote: In this case I would be tempted to do the banners as background images, so you could just do

background-position: fixed;

Alrighty, I'll play around with that, thanks for the help!


To protect the world from devastation.
kidd25 is the best Newgrounder ever.

BBS Signature