Make width 95% and yet shrink to 750px?

I would like to make the page width 95% and when the browser window is reduced the page shrinks to 750px. How can I achieve this?

The stylesheet currently has the page width of 95%.

mainWrapper {
background-color: #ffffff;
text-align: left;
width: 95%;
vertical-align: top;
border: 2px solid #00AFF0;
}

Your help is very appreciated!

Surely there is a simple solution?

Why not add something like:

width: 95%;
min-width: 750px;

IE does not support the min-width feature, most other browsers do. Google around for a fix for IE.

Thank for the tip Brickoneer.

Yep, min-width works fine in firefox. After a bit of a search I found that min-width should also work for ie7, haven't tested this though. A hack like this may may also work, (didn't work for my version of ie though):

min-width: 800px;
width:expression((document.documentElement.offsetWidth < 820)? “800px”: “auto” );

See more: HERE

I'm trying to get mine to go to 100% but am having no luck. I have changed mainWrapper in the CSS files to be 100% from the 85% but it still hasn't changed.

Is there anywhere else that controls the overall width of the entire site?

Thanks!

Jake

That depends on what template you are using.

Some templates set widths for the parts of the page as well as for #mainWrapper, and some commercial templates have all sorts of non-standard tags for parts of the page, so standard fixes are irrelevant.

And are you sure you edited the right copy of stylesheet.css? It needs to be the one in the template folder you have active.

With a link to your site, we could tell you exactly what will work in your case.

I'm having the same sort of problems.

My site seems to display nicely in 800 resolution or in a reduced size window - but in full screen it throws the graphic across to the right.
Is there any way I can stop this. Basically i'd like my site to be no wider than the width of the logo? or just slightly bigger say 800 pixels maxium - regardless of the resolution being used.
I guess its something in the stylesheet but I've played about with it and nothing seems to change regardless of what I do.

The site is https://www.rosebarnnursery.co.uk
thanks

Phil

#mainWrapper {
        width:741px;
	margin: auto;
} 

Add the part in red

thanks Mike but that doesn't seem to work either. It just seems to ignore what I put in the css file.

Actually it work fine but your logo is only 741px wide so 800px looks stupid.....which is what you put there

you also need to adjust this statement:```
#navColumnOneWrapper, #navColumnTwoWrapper {
margin: 0 0.5em;
}

To read:```
#navColumnOneWrapper, #navColumnTwoWrapper {
	margin: 0 0.5em 0 0;
}

To get the left column to line up

Thanks Mike

I've changed the css to 741px as you put but on my browser it still doesn't work. I've tried deleting the history and refreshing but to no avail. I am using IE 7.0
I'll try it on a different pc and see if it displays right.

Thanks

Phil : )

ok it is displaying at 741 px wide but what is also happening is that the empty right column is displaying.....which I didn't catch before. so if your not going to use the right column goto admin>configuration>layout settings>Column Right Status - Global and set to 0
Then make that other fix I mention about the left column and everbody should line up