Christine Reed wrote:
> I have just built my first successful 3-column layout - 'proper' contents still need adding.
> It works well at 1024 res and above but when the viewport gets reduced (eg at 800 res) or if
Favourites is open on the side, the whole thing degrades badly - ie page elements move out of place
starting with the image placed in the middle column.
> I suspect it is because the text can resize because I have used {margin:auto;} as well as
percentages for the body and the <div>s but the image has a fixed width and shifts instead of
resizing...
> Is there a way I can get the image to behave like the rest and resize?
>
> Many thanks to anyone willing to help me!
>
> To test what I mean:
> http://www.clairerich.co.uk
> ______________________________________________________________________
> 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/
>
>
>
I only looked at this page
<http://www.clairerich.co.uk/introductionwhite.html>
Part of the problem, Claire, is the software can't find the doctype,
because <dl></dl> is preceding it. Delete those.
Changing this selector to read:
#content img{ padding:10px 0;
text-align:center;
/*margin-left:130px; delete this*/
display: block;<<<<< add this
margin: 0 auto;<<<<< add this
}
should center the image in its container.
Add an empty comment here, like so (I do not know why, but it helps--
makes it not empty, I guess?):
<div class="cleardiv"><!-- --></div>
You have 3 images specified in the markup. /Each/ of them needs an alt
(whatever it's called) thing, like:
<img src="http://www.clairerich.co.uk/Pictures3/arrow1w27x20.gif" alt="">
Then valididate the markup here: <http://validator.w3.org/> .
Then validate the CSS (correct errors-- ignore warnings for the time
being) here:
<http://jigsaw.w3.org/css-validator/>
Not tested.
HTH.
Regards,
~dl
--
http://chelseacreekstudio.com/ca/ccs/pow/pow.html
______________________________________________________________________
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/