I am looking at a website on the internet with the standard centered box design (the entire site is centered in a box and has a border each side). As you shrink it, the border gets smaller but the content stays the same size. This is fine.
However on their site, once you get smaller still, you simply get scrollbars. The content remains untouched. On my site if you do this, things like text and 开发者_StackOverflow中文版links start to scroll onto multiple lines and the whole site gets broken. How can I keep it the same even when the viewport is small?
You can try this:
#box
{
width: 500px;
/* overflow set to scroll will give you your scroll bars */
overflow: scroll;
}
If you are looking to handle the minimum width, it is a little trickier as min-width is not supported by IE.
You can try this:
#container
{
/* IE will ignore min-width */
min-width: 400px;
/* IE will process the expression below to give you your minimum width, other browsers
will ignore it */
width:expression(document.body.clientWidth < 400? "400px": "auto" );
}
Sounds like you're looking for min-width
.
Add min-width and min-height attributes to your Content element's CSS. Like= min-width: 100px; min-height:100px; ...
精彩评论