Hi all,
I am reworking a site (it is still in the very rough beginning stage)
and I find that when I set everything lined up in 600x800 and switch to
1024x768, the spacing changes and vice versa. Is there some way to make
the right edges line up no matter what the resolution? The url is:
http://www.starqualitydesigns.com/Moodus/whatis.htm and the css is:
body {background: url(images/stripeblueback.gif) repeat; color: white;
margin: 0; padding: 0;}
div {border: 1px solid #335;}
h1, div {
background: transparent;
color: black;
margin-bottom: 5px;
}
p {
margin: 1em 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;}
span.leader {font-style: italic;}
span.label {font: italic 1em Arial, sans-serif; letter-spacing: 1px;}
h1, h3, h4 {
font-family: Arial, sans-serif;
font-style: italic;
font-weight: normal;
margin: 0;
text-transform: lowercase;
border: 0;
}
h1 {
letter-spacing: 0.75em;
color: #369;
padding: 0.25em 0.33em 0.125em;
border: 3px double #224;
background: #369;
margin-top: 5px;
margin-left: 15px;
margin-right: 15px;
}
h3 {font-weight: bold; color: #113;}
h4 {
font-weight: bold;
letter-spacing: 0.5em;
padding: 0.33em 0.5em 0.167em;
border-top: 1px solid #335;
border-bottom: 1px solid #557;
background: #336699;
color: #335;
}
div#behind {
position: relative;
float: right;
top: 30px;
z-index:1;
width: 40%;
height: 600px;
border: 0;
padding-right: 6px;
background: transparent;
text-align: right;
margin-right: 40px;
display: inline;
}
div#sidebar {
position: absolute;
top: 7.2em;
left: 0;
width: 15%;
background: transparent;
padding: 0;
margin: 1em;
border-width: 0;
}
div#sidebar div {
margin-bottom: 1em;
margin-top: .75em;
}
div#sidebar a {
display: block;
margin: 0;
padding-top: 0.25em;
padding-bottom: 0.25em;
letter-spacing: 1px;
text-align: center;
font-weight: normal;
border-bottom: 0;
color: #224;
background: #338;
font-size: 12px;
text-decoration: none;
}
div#sidebar a:link {color: #226; background-color: transparent;}
div#sidebar a:visited {color: #224; background-color: transparent;}
div#sidebar a:hover {background-color: #224; color: #338;}
div#sidebar a span {display: none;}
div#demos {
border: 3px double #224;
background-color: #6699CC;
font-family: Arial, Helvetica, sans-serif;
}
div#demos h4 {
background: #369;
color: #224;
text-transform: uppercase;
font-style: normal;
text-align: center;
}
div#demos a {
font-face: Arial, Helvetica, sans-serif;
color: #224;
background-color: #99ccff;}
div#demos a:hover {
background: #336699;
color: #6699cc;
}
div#sidebar a#gallery {border-top: 4px solid #88B; font-size: 90%;}
div#resources a {font-size: 90%;}
div#note p {margin: 0; padding: 0.66em; font-size: 80%; font-family:
sans-serif; line-height: 1.33; color: #335;}
div#sidebar div#credits a {padding: 0.33em 0.66em 0.167em 0.66em;
letter-spacing: 0; font-weight: normal; text-align: left; font-size: 90%;}
div#main {
position: absolute;
top: 8.2em;
left: 16.5%;
width: 73%;
margin: 1.2em;
margin-top: 2em;
padding: 1em 1.5em;
border: 3px double #224;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background: #6699CC;
letter-spacing: 1px;
color: #000;
}
div#main p {
position: relative;
float: left;
top: 5px;
left: 10px;
background: transparent;
width: 50%;
padding: .5em;
border: 0;
}
div#main h3 {letter-spacing: 3px; margin: 1.25em 0 0;}
div#main h3#top {
margin-top: 0;
color: #224;
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
text-transform: uppercase;
background: transparent;}
div#main p {margin: 0.25em 0 1em; line-height: 1.25em;}
small {letter-spacing: 0; font-size: 85%;}
div.NN4 {display: none;}
TIA,
Riva
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
