1 reply [Last post]
Subplastic
Offline
Regular
Last seen: 16 years 5 weeks ago
Joined: 2004-06-30
Posts: 13
Points: 0

Hey guys,

Well i'm trying to make my new site with xhtml and css.
Still struggling though

basically i'm a bit confused

when adding multple elements into a div, i seem to get this problem with xhtml, where it adds spaces in between the elements etc

<div id="header"><img src="interface_img/top_bar.gif" />
<img src="interface_img/header_segment_1.gif" />
<img src="interface_img/header_segment_2.jpg" />
</div>

Now that adds a space between each element, and pushes the first image down, when it supposed to flush up against the top of the page

but....... when i do this........

<div id="header"><img src="interface_img/top_bar.gif" /></div>

it works fine, and all i'm doing is removing the other 2 images and putting the closing div tag back onto the same line....

if i do this....
<div id="header"><img src="interface_img/top_bar.gif" />
</div>

i get the same problem where it pushes the image down a space

The page in question is up at : http://www.subplastic.com/css/mainbody.html

If someone could please help me with his issue, that would be great, as i dont want to spend the rest of my web design life, having to close a div around every singly element Sad sob sob

cheers and thanx for your help

Stu
Stu's picture
Offline
Enthusiast
Bristol uk
Last seen: 16 years 28 weeks ago
Bristol uk
Joined: 2004-01-20
Posts: 282
Points: 0

Xhtml headaches...............

This is a 'design feature' in IE Shock(

The answer is either to put all the images in one line in your html

<div id="header"><img src="interface_img/top_bar.gif" /><img src="interface_img/header_segment_1.gif" /><img src="interface_img/header_segment_2.jpg" /></div>

or using css define the style of your images as

img {display:block;}

It's not what you do it's the way that you do it.
So do it with STYLE
http://www.s7u.co.uk