Image/Text Spacing

**TomTom100** · 06-08-2011 01:15 PM

Hi

I have an image aligned to the left and then some text next to it but the text is right up against the image making it hard to read. Is there a way to fix this?

Here's the html

<img src="Images/GRASS_SUNSET.jpg" width="400" height="268" alt="Sunset" align="left"/>
<p>A yellow sunset through a field of grass. This photo was taken on a Nikon D60 with no flash. The aperture was set to f/10 and shutter speed to 1/25 sec. ISO was at 100 and focal length was 55mm. The photo RAW file was then edited in Photoshop CS5 to give a dynamic yellow look. This photo was taken on May 5th 2011</p>

and the CSS (for the whole div, although I don't think it's necessary)

#body { background-color:#f0eccd;
width:780px;
margin-left:auto;
margin-right:auto;
overflow:auto;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:20px;

}

Thanks

Thomas

**coothead** · 06-09-2011 02:01 AM

Hi there TomTom100,

the align attribute is deprecated in favour of CSS.

Try it like this...

Code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">

<title>grass sunset</title>

<style type="text/css">
#body { 
    width:780px;
    margin:auto;
    overflow:hidden;
    padding:5px 10px 20px;
    background-color:#f0eccd;
 }
#sunset {
    float:left;
    width:400px;
    height:268px;
    margin-right:10px;
 }    
</style>

</head>
<body>

<div id="body">

<img id="sunset" src="Images/GRASS_SUNSET.jpg" alt="Sunset">

<p>
A yellow sunset through a field of grass. This photo was taken on a Nikon D60 with no flash. 
The aperture was set to f/10 and shutter speed to 1/25 sec. ISO was at 100 and focal length 
was 55mm. The photo RAW file was then edited in Photoshop CS5 to give a dynamic yellow look. 
This photo was taken on May 5th 2011
</p>

</div>

</body>
</html>

coothead

**TomTom100** · 06-09-2011 09:33 AM

Thank you! Everything is sorted now!

Best Regards
Thomas

**coothead** · 06-09-2011 11:32 AM

No problem, you're very welcome.

Thread: Image/Text Spacing

Thread Tools

Display

Image/Text Spacing

Thanks!

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions