...

View Full Version : Fluid page "side borders"



Cisneiros
11-25-2009, 11:53 PM
Hello!

Well, I made a layout and, while trying to transform it from PSD to CSS, I came across a difficulty that I cannot solve.

This page has the following structure:


[WRAP = min-width:1022px; max-width:1250px]
[HEADER]
[LEFT = float: left]
[RIGHT = float: right]
[CENTER = float: left]
[SIDEBAR = float: left]
[CONTENT = float: left]
[FOOTER]The LEFT and RIGHT div's are the borders of each side (with background images) were supposed to shrink down it's width if the user's screen resolution is small. I tried anything I could but I cannot get this done!

Right now, they're fixed-width, as I cannot find a solution to this problem.

If anyone can help me, I appreciate so much! :D

Thanks in advance!
Alex.

[EDIT] Oh, I forgot the link! http://cisneiros.com/tests

vineet
11-26-2009, 04:23 AM
try using 'em' or '%' instead of 'px' if you are concern about screen resolution.

vineet

Cisneiros
11-26-2009, 09:21 AM
vineet, that's a good ideia, I'll try it.

But the point here is how to make the page borders (LEFT and RIGHT div's) fluid.
Like: if you have a big screen, the boders show up fully. If you have a smaller screen, the borders shrink, so you won't get scroll-bars. I tried min-width = 0 and max-width = (the correct width) on the borders, but if I do it, they just disappear.

Cisneiros
11-28-2009, 07:37 PM
Well, I found no CSS solution, so I'm appealing to JavaScript :/

http://cisneiros.com/tests/test.html
This was the way I found, but there must be a way to do this with CSS!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum