[RESOLVED] Prevent from resizing
Hi good day guys. I know this is dead easy to those experienced CSS coders. I have this problem that when I resize or maximize the window of my browser my page will also resize. What I want is my page will be in the center and when resizing or maximing the window of my brower my page will not resize, the width will not increase. How can I do that? I used the mid-width attribute to make my page in the center. Problem solved when I used table and change the mid-width to width but I want my page doesn't contain a table as possible.
Code:
#content{
margin-left:5%;
margin-right:5%;
margin-top:5%;
min-width:500px;
border:1px solid black;
padding:5px;
background:white;
text-align:left;
}
'html code
<html>
<head><title>sample</title>
<link rel='stylesheet' type='text/css' href='mystyle.css'>
</head>
<body>
<div id='content'>
asdfasdfasdf
</div>
</body>
</html>
cheers. :)
Re: Prevent from resizing
You can specify a width on the body, that will keep it the same width no matter the window size. Best to use the "ex" unit for that as that is dependent on the font size, so the user can scale it - unless you're relying on pixel precision for graphics.
There is also min-width max-width you can use if you want to have some degree of resizing with the window. But these are not supported in IE <= 6 AFAIK.
Code:
body
{
width: 500px;
}
Side note - I know you've probably simplified it down for the sake of example, but in case you haven't. You don't need a content div, if it's the only thing in the page. Just apply all those properties to the body instead.
Also, specify as much as you can in the html element. Things like fonts, viewport (window) background colour, etc.
Re: Prevent from resizing
Yeah I just simplied it for example. By setting the width of the body it will not center my page. It docks in the left side. What I want is that my page will be in the center of the window.
Re: Prevent from resizing
Use auto horizontal margins to centre a block element.
Code:
body
{
width: 500px;
margin: 0 auto;
}
Re: Prevent from resizing
cheers Pen. Now it works. :)
I hope I can rate you. They want me to spread more before I give it to you. :(
Re: Prevent from resizing
It's like bread and butter. If you clump it all in one or two places then you have lots of bread with no butter. But if you spread it around then you have a nicely buttered slice.
Of course, you want to avoid the mouldy bits though.
Re: [RESOLVED] Prevent from resizing
Pen there is a problem. It only works in Firefox and not in IE. :(
It still resize when you use IE.
Re: [RESOLVED] Prevent from resizing
Your document must be in Quirks mode. In quirks mode IE does not distinguish between the BODY and HTML elements, in standards mode it does.
Make sure you have a <!DOCTYPE line for HTML 4 Strict on the first line of your file.
Re: [RESOLVED] Prevent from resizing
cheers that solved the problem but still I faced another problem about floating, it seems IE doesn't recognize the float attribute. :( Or I'm just wrong in using them.
Re: [RESOLVED] Prevent from resizing
It does,
Post the offending code?
