Yeah, and wut. I like viewing my 24 incher in such a resolution.
Anyway, most sites should be able to be viewed at such resolution. Fairly average.
It's a CSS issue and since I'm in a good mood (and pretty anal) here's the fix:
before:
#forum_welcome {
width: 68.5em;
font-size: 1.4em;
line-height:1.9em;
padding: 2em 4em;
border: 1px solid #111;
background:#111 url(/forums/style/Default/images/default_userpic.gif);
color: #fff;
border-radius: 4px;
margin-bottom: 1em;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}
after:
#forum_welcome {
padding: 2em 2em 2em 2em;
font-size: 1.4em;
line-height:1.9em;
border: 1px solid #111;
background:#111 url(/forums/style/Default/images/default_userpic.gif); color: #fff;
border-radius: 4px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
margin: 0 200px 1em 0;
display:block;
position:relative;
}
removes width, changes padding, changes margin and adds: display:block;
position:relative; etc etc
Next:
before:
#forum_welcome a {
display: block;
background: #c6076c;
border: none;
width: 12.3em;
text-transform:uppercase;
text-decoration:none;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
padding:.5em 0 .5em 3em;
margin: 0;
color: #fff;
font-family:sans-serif;
font-size:.8em;
font-weight:bold;
cursor:pointer;
margin-top: 2em;
margin-left: 35em;
}
after:
#forum_welcome a {
display: block;
background: #c6076c;
border: none;
width: 12.3em;
text-transform:uppercase;
text-decoration:none;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
padding:.5em 0 .5em 3em;
color: #fff;
font-family:sans-serif;
font-size:.8em;
font-weight:bold;
cursor:pointer;
margin-top: 2em;
margin:auto;
}
Removing both the margin:0 and the very poor attempt at centering with margin-left:35em; In turn placing margin: auto to replace both and thus centers exactly, rather than half ass
Also, I'd null out:
padding-left: 4em;
padding-right: 4em;
from:
#forum_welcome p {
margin-bottom: 1em;
padding-left: 4em;
padding-right: 4em;
}
leaving simply:
#forum_welcome p {
margin-bottom: 1em;
}
Simply for aesthetic reasons... to each their own, I guess.
Tested in Safari and Firefox... and if it works in Safari it more than likely works in Chrome.
Other browsers do not exist in my mind.
Should look like this now in a 1024x768 screen, after fix, of course:
Tada. That bit should now be 100% fluid, I believe, rather than fix width.
Ok, I think that should do it.
Cheers m8! xD
Last edited by Mono (Jan 8, 2010 9:34 am)