[thelist] IE7/Vista, Opera issue

ben morrison morrison.ben at gmail.com
Fri May 25 08:24:17 CDT 2007


On 5/25/07, John Allsopp <john at johnallsopp.co.uk> wrote:
> Hi
>
> I wonder if anyone has a hint for me about this
> <http://www.johnallsopp.co.uk/testHomePageImageSize/index.php4>.
>
> In most browsers, the table fits within the div which is 60% wide, and
> the images resize to suit, which is what I wanted.
>
> In IE7 under Vista (and, I think, XP), the images don't resize, so it
> all stretches to the right on a 640x800 screen.

Not sure why, but yes it seems to calculate the width of the table
wrong. I've never been sure about resizing images as they never look
that great, especially if you are using fonts. It maybe an idea to use
HTML for the words....

> I've tried plenty of things but nothing seems to have worked, I wondered
> whether people think the initial strategy (table) was always doomed and
> I should be using divs, abs pos, or whatever, or whether I'm just
> missing the crucial bit.

You could replace it all with CSS, I've intentionally avoided adding
the two half images upto 100% as IE has rounding errors.

<style type="text/css">
	body {
		text-align:center;
		background:#09143f;
	}
		.half	{
	background-color: rgb(9,20,63);
	width:50%;
	float:left;
	border:none;
}
.left	{
	width: 60%;
	margin:44px auto;
	}
	.half	{
	width:49.5%;
	float:left;
	border:none;
	margin-top:1%;
}
.halfRight	{
	width:49.5%;
	float:right;
	border:none;
	margin-top:1%;
}
.whole {width:100%;
}
	</style>
</head>
<body>
	<div class="left">
	<img src="http://www.johnallsopp.co.uk/testHomePageImageSize/tenpinbowling.jpg"
class="whole"></a>
	
			<img src="http://www.johnallsopp.co.uk/testHomePageImageSize/balconybar.jpg"
class="half"></a><a href="amusements.php"><img
src="http://www.johnallsopp.co.uk/testHomePageImageSize/amusements.jpg"
class="halfRight"></a>
	</div>

ben
-- 
Ben Morrison
http://www.benjaminmorrison.com



More information about the thelist mailing list