Previous Message
Next Message

Resolution question

Sent by Portman on 30 March 2006 19:07


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-REMOVED]]
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/
Previous Message
Next Message

Message thread: