witten
/
luminotes
Archived
1
0
Fork 0

Made CSS layout much better for scaling to small and large resolutions.

Toolbar and link area now both stay somewhat near the center area.
IE max-width hack rewritten to work better.
This commit is contained in:
Dan Helfman 2007-09-23 20:42:44 +00:00
parent 0c9c2b6ac2
commit 13c63fd400
3 changed files with 15 additions and 15 deletions

View File

@ -19,12 +19,11 @@
top: 0em; top: 0em;
} }
#center_and_toolbar_area {
width: expression( this.width > 500 ? "500px" : "70%" );
}
#center_area { #center_area {
width: expression( this.width > 475 ? "475px" : "69%" ); width:expression(
document.body.clientWidth > ( 1250 / 12 ) *
parseInt( document.body.currentStyle.fontSize ) ? "45em": "60%"
);
} }
.pulldown { .pulldown {

View File

@ -28,22 +28,22 @@ ol li {
margin-top: 0.5em; margin-top: 0.5em;
} }
#center_and_toolbar_area { #everything_area {
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
width: 80%;
max-width: 60em;
} }
#toolbar { #toolbar {
position: fixed; position: fixed;
margin-top: 5em; margin-top: 5em;
left: 20%;
margin-left: -4em;
z-index: 1; z-index: 1;
} }
#toolbar ul li { #toolbar ul li {
list-style: none; list-style: none;
text-indent: -2em; text-indent: -2.5em;
margin-top: 0em; margin-top: 0em;
margin-left: 0em; margin-left: 0em;
margin-bottom: 0.25em; margin-bottom: 0.25em;
@ -95,9 +95,10 @@ ol li {
} }
#link_area { #link_area {
position: absolute;
text-align: left; text-align: left;
float: right; left: 80%;
margin-left: 1em; margin-left: 1.5em;
margin-top: 1em; margin-top: 1em;
margin-right: 2em; margin-right: 2em;
font-size: 85%; font-size: 85%;
@ -113,8 +114,8 @@ ol li {
#center_area { #center_area {
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
width: 79%; width: 60%;
max-width: 55em; max-width: 45em;
} }
#status_area { #status_area {

View File

@ -19,12 +19,12 @@ class Main_page( Page ):
Div( Div(
id = u"status_area", id = u"status_area",
), ),
Toolbar(),
Div( Div(
Link_area( notebook_id ), Link_area( notebook_id ),
id = u"link_area", id = u"link_area",
), ),
Div( Div(
Toolbar(),
Div( Div(
Div( Div(
Div( Div(
@ -65,6 +65,6 @@ class Main_page( Page ):
), ),
id = u"center_area", id = u"center_area",
), ),
id = u"center_and_toolbar_area", id = u"everything_area",
), ),
) )