16 replies [Last post]
le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

I want a div that spans 90% of any given resolution window size...
instead of saying
width: 90%;
I put width:900px; which works fine for my 1200x768 resolution but when I change the res for testing its just scrolled... any suggestions?
Thanks

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 17 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

:?

:? :?

Have I missed something here?

What you want is covered by using % why do you reject the use of percentage in this instance and as you show?

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

Hey Hugo! Mate it all goes

Hey Hugo!
Mate it all goes back to my resize problem - I don't want the whole site to resize when for example a window is set to restore-down. Get me? I want it to remain 900px across and not be 90% of the new window size!
Hope that makes sense... any ideas???

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 17 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

I assume his post is still

I assume his post is still really to do with your last one? I re-read your opening post and I'm afraid that it does not really make sense, the best thing is for you to do what was asked and produce the html output along with the rules so that we may see what's happening.

Soryy if I'm being dense on this one.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

What I think he wants is for

What I think he wants is for the width to be set to 90% of the browser width when the browser is opened, but if the user re-sizes the window, whatever pixel width the page was on opening then becomes fixed.

So, if a user has a 1024 screen, the viewport is pprox 1000 pixels, so 90% is 900px. The user re-sizes to (say) 800 px wide, but he wants the page to stay at 900px wide.

I think that's it.

I think it can only be done by using the DOM/Javascript for each browser (yes, they differ from browser to browser) (which fails if the user has it switched off).

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

No buddy not at all! Its a

No buddy not at all!
Its a hard question to get across...
I'll bare-bone it down for you...

Is there an alternative to % for width property other than pixel?
At present 90% is 90% of any window size no matter what the user as set it to.

900px messes up with different resolutions...

Is my best bet just to set a div to be 800px across? ITS JUST SOOOO SMALL!!!!!!!!
I want my site layout to be around 1 inch from left and right of ANY screen ONLY on fullscreen... get me?

If I set a div for 900px wide and someone has a 800x600 display it'll look messy...

However when the window is resized from maximum to medium the I want the horizontal scrollbar to come into play and SCROLL Smile

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

Treva, THAT is EXACTLY it

Treva, THAT is EXACTLY it mate... well done on grasping it!!!

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 17 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Well done treva that one

Well done treva that one clearly alluded me, possibly because I am just too dense :shrug: Smile

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

No man it was tricky to

No man it was tricky to explain - soz for wrecking your heads! Any suggestions for a solution???

Twisted Chaz
Offline
Regular
Last seen: 11 years 30 weeks ago
Timezone: GMT+1
Joined: 2006-11-29
Posts: 15
Points: 4

Why don't you try some

Why don't you try some min-width hacks?

There is one where you have a 1px high clear gif that is the width of whatever minimum width you want.

But I don't think min-width is supported in that many browsers.

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

What do you mean? I've never

What do you mean? I've never even heard of min-width! EEEK.... showing my novice now Smile

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 17 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

In real browsers you can use

In real browsers you can use min/max width/height statements IE6 does not understand these so one way around this is to use a fixed width image to hold the element open at a specified width, but I don't think this is what you're after, I think Treva is probably right that you need a scripting solution.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

Ok thanks - I'll have to

Ok thanks - I'll have to look for a script somewhere, what would the heading be do you think?
I mean something like "javascript fixed position"?
Thanks for replies guys by the way!

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 10 weeks 19 hours ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

I see what you want to do,

I see what you want to do, but I cannot fathom why you want to do it. Counter to Treva's description is the case where the site is opened in an 800px window, and then resized to 1280px. Do what you ask, and the original rendering is about 650px wide and stays there.

Another solution would be something like Jello Molds width control. I have used the method on my html and css playpen site. I didn't apply any work arounds for IE, so view it in a modern browser.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

Thats unbelievable! Jello

Thats unbelievable! Jello Molds is EXACTLY what I'm looking for... awesome! Thanks...
It does look fairly tricky to implement though...

Check out this site (for all u americans its a girls shop-a friend of mine works there)
http://www.topshop.com

The width of that main div or table whatever it is, is around 900px - so IF someone has a 800 width resolution they're scrolling, what do you all think of that???

PS In the end I've gone with 900px wide for the main div, who cares who the very odd person has to scroll???

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Ah so said Grasshopper. The

Ah so said Grasshopper.

The jello mold is indeed the ideal way to do what you want. It isn't so difficult to follow, just read the notes and make little changes at a time.

le007
le007's picture
Offline
Enthusiast
Last seen: 12 years 1 week ago
Joined: 2006-10-08
Posts: 160
Points: 0

Thanks Trevstor will give it

Thanks Trevstor will give it a lash!