PDA

View Full Version : img & validation woes

Pottsy
04-28-2008, 10:20 AM
hi - i'm having trouble validating what should be a straightforward / simple code snippet from the css anthology

<style type="text/css">
.featureimage {float:left;
width:319px;
height:255px;}
</style>

</head>
<body>
<h1>Chinese-Style Stuffed Peppers</h1><img alt="peppers" id="logo" src="peppers.jpg" />

<p>.various content blarb...
</p>

</body>
</html>

sorry for wasting your time with this problem, it seems fairly dumb, i'd really appreciate any suggestions which set me on the right trail, i'm determined to become good at this CSS positioning lark
Pottsy
04-28-2008, 10:23 AM
I get this error on the w3c validator *growl*

Line 17, Column 87: document type does not allow element "img" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "address", "fieldset", "ins", "del" start-tag.

…ppers" id="logo" src="peppers.jpg" />
abduraooft
04-28-2008, 10:46 AM
Yes, you need to wrap all inline elements/text inside atleast one block level element.
You could place it inside h1, or inside the following p, Or have to add an extra div or p fo that image.
Pottsy
04-28-2008, 11:14 AM
thanks abduraooft - putting it in the h1 element cured the problem, this behaviour came out of nowhere to hit me what's it called / referred to as?

thanks

Pottsy
VIPStephan
04-28-2008, 02:06 PM
The problem is that no inline element may be direct child of the body element. To be safe from such issues (and to help structuring/styling the document) it’s wise to put an all-wrapping container element (usually a division) where you put the content of the page.

The same inline vs. block element issue occurs in forms: No form control element (e.g. input) may be direct child of the form element itself, it must be within a block element (e. g. fieldset or div, or whatever).