Printable View
Not me! 1280 x 800 or something on my laptop...
For your audience I reckon you can go larger and forget 800x600. We're currently redesigning our site (at work) and making it a bit larger.
I think mainly people working in banks and schools have tiny screens :p
To emulate max-width (or max-height, min-width or min-height with some modification) for IE, you can use:
width:expression( document.body.clientWidth > 500 ? 500 : "auto" );
Where both 500's are the max-width you want to use. "expression()" is IE-specific and will be ignored by other browsers. This means it's browser proprietary code, which is generally frowned upon, but readability goes before code perfection in my opinion.
I'm browsing this page in 240x320.
1280 x 800 on my laptops, and 1280 x 1024 with my desktop.
@Rantzien: Thanks, that works but... when I add that in, it overrides the max-width I have for Firefox. >.< How do I make it work for both browsers?
I've always heard that 800x600 is more of a courtesy for people who don't browse in maximised windows.
I use a 1440 x 900 resolution but I am currently browsing in a 1300x720 window (just the website not the nav bar or anything). However I change my browser size (width especially) quite frequently depending on what other programs I have up and which sites I'm viewing.
My biggest issue when I was making a website was Mac vs. PC. I had the whole thing absolutely fantastic looking on both Safari and Firefox on my Mac, but when I switched over to my PC, IE and Firefox had their own issues. I was running up and down stairs to switch between computers for a long time. Who says there's no such thing as geeks exercising?
Good luck.
Oooh never mind Rantz, that was a coding error on my part. xD
Now I just need to fix one more thing in IE... so let's say I have a table and I set a height and width for the <TD>. Then, with no cellpadding or cellspacing and div-right and top and all that good stuff at 0... I put an image that's the exact same size as the table in the <TD>. How do I get it so that IE doesn't add extraneous borders?
And ah Kes, websites look different on Macs and PCs? o_O
Only in the sense that the browsers are different. Like I mentioned in the browser thread, I'm pretty sure that even if you use Firefox on all your OSs it will have at least subtle differences, but it's been a while.
Edit: I tried to clear this up a bit by posting some screen shots in the Browser thread because I'm silly like that. I totally did not intend to split up my ideas into two threads. >.<
PutQuote:
Originally Posted by Jojee
border-style:none;
for the table or the image, depending on which has the border.
800x400 and 1280x1024, also you suck JoJo!
FInally don't forget to set up a second stylesheet which you can use for lower res', bug me on MSN sometime and I'll show you what I mean :p
Home: 1680x1050
Work: 1600x1200
1024 x 768. Anything else looks weird on my compy.
My screen made a resoultion to quit smoking this year but it didnt turn out too well :(
Anyway i use 1024 * 768 but dont feel you have to design a website for this resolution just because everyone uses it. It depends on your website. If you dont need that many pixels then just go with 800 * 600. Pick the one that leaves you with less clutter but not too much blank space.
Here's a useful way to make browser-specific code: *wrecks tables* (*fixes tables*) :p
HTML Code:<html>
<head>
<title>lol</title>
<style type="text/css">
#tablecat {
width: 1000px;
background: black;
border: medium solid yellow;
color: yellow;
text-align: right;
vertical-align: auto;
font-family: arial;
font-size: 50px;
}
#tablecat td { border: thin solid white; background-image: url('http://www.processandfaith.org/images/background-ocean.jpg'); }
</style>
<!--[if IE]>
<style type="text/css">
#tablecat {
width: 250px;
height: 200px;
background: rgb(100, 100, 180);
border: thin dashed rgb(150, 50, 50);
color: red;
text-align: center;
vertical-align: bottom;
font-family: copperplate gothic bold;
font-size: 15px;
}
#tablecat td { border: thin solid white; background-image: url('http://www.graphicsarcade.com/backgrounds/dark/dark_background_11.gif'); }
</style>
<![endif]-->
</head>
<body>
<table id="tablecat">
<tr>
<td>
You are <comment>not</comment> using IE.
</td>
</tr>
<tr>
<td colspan="100%">
This table will look completely different if you view it in <!--[if IE]>Mozilla<![endif]--><comment>IE</comment>.
</td>
</tr>
</table>
</body>
</html>
PHP Code:<html><body><whatever><b>You can always just do this if you don't want to mess up tables.
It seems to work, anyway.</b></whatever></body></html>