how to find solution for changing screen width?

Forum Moderators: coopster

Message Too Old, No Replies

how to find solution for changing screen width?

toplisek

12:42 pm on Nov 2, 2009 (gmt 0)

I see that basic concept of layout is:
top
middle
footer

How to make CSS layout like google to have top part as 100% width with padding but middle part resize with sceen resolution.
Is this pure CSS skills or I have to use Javascript code to defined sceen resolution?

If you use 15'4 laptop is middle part different from 17'' as it seems it is moving larger and not fixed width.

rocknbil

5:25 pm on Nov 2, 2009 (gmt 0)

Javascript is the only way I know of to get the viewport size - the area under control with the browser. There **is** no way to step outside the browser and read '15" monitor at 640 X 480 resolution.' But the viewport is probably all you really care about.

The only other way I know of is via ActiveX and the user has to allow you to execute the actions to read the system settings.

toplisek

8:59 pm on Nov 2, 2009 (gmt 0)

There are two parts, one pushed to the left of my browser (float:left), and one pushed to the right (float:right). Then I see the rest of the page centered on my browser (margin:0 auto).

All that's easily done with CSS and no JS.
Check 15,4' and 17'' and see enlraged right part I guess...

Tommybs

6:48 pm on Nov 3, 2009 (gmt 0)

You're probably better off posting this in the CSS forum then and not php.

My guess is you want something like


<style>
body{
 text-align:center;
margin:0px;
padding:0px
}
#header{
width:100%;
height:50px;
float:left;
background:red;
text-align:left;
}
#header .left{
float:left; color:white;
}
#header .right{
float:right; color:blue;
}
#cont{
margin:100 auto;}
</style>
</head>
<body>
<div id="header">
<span class="left">
left
</span>
<span class="right">
right
</span>
fdsg</div>
<div id="cont">
CONTENT</div>
</body>

Is that what you're after?