6 replies [Last post]
Rookie
Offline
Regular
Last seen: 18 years 1 week ago
Timezone: GMT-4
Joined: 2004-05-19
Posts: 13
Points: 0

How do I make it so that I can define where other images are located under .center ? The .left stays cenetered like the .center:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css"
href="layout.css" />
</head>
<title>Oasis Beverages</title>
<body>
<div id="center"><img src="/images/header.jpg" /></div>
<div id="left"><img src="/images/left.jpg" /></div>
</body>
</html>

/* Layout */

body {
text-align: center;
     }

.center {
text-align: left;
margin: 0 auto
        }

.left {
margin-left: 20px
      }

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 5 days 6 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Layout

Hi Rookie,
Give the images a class then use that to position them.

.ione{float :right; width:100px; height:100px; margin-right:10px;}
<img class="ione" src="pathtoimage.gif" />

Hope that helps

Rookie
Offline
Regular
Last seen: 18 years 1 week ago
Timezone: GMT-4
Joined: 2004-05-19
Posts: 13
Points: 0

Layout

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css"
href="layout.css" />
</head>
<title>Oasis Beverages</title>
<body>
<div id="center" class="body"><img src="/images/header.jpg" /></div>
<div id="left" class="body"><img src="/images/left.jpg" /></div>
</body>
</html>

I don't know why you posted that coding as well, I'm lost.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 5 days 6 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Layout

Hi Rookie,
Sorry I read you post incorrectly.
What I thought you were going to do was add other images inside the center div.

What you could do is float the images left or right.
You don't really need to have them each in their own div, just give them a class.

Hope that helps

Rookie
Offline
Regular
Last seen: 18 years 1 week ago
Timezone: GMT-4
Joined: 2004-05-19
Posts: 13
Points: 0

Layout

Not really, but I have it kinda figured out.

MaxJ
MaxJ's picture
Offline
Regular
Last seen: 1 year 25 weeks ago
Joined: 2003-08-28
Posts: 36
Points: 0

Some errors...

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Oasis Beverages</title>
<link rel="stylesheet" type="text/css" href="layout.css" />
</head>

<body>
<div class="center"><img src="/images/header.jpg" /></div>
<div class="left"><img src="/images/left.jpg" /></div>
</body>
</html>

You've got several errors in your code to start with. The title is in the wrong place, and you've got your id's and classes muddled up.
In CSS classes would be;
.center_this {}

an ID would be;

#center_this{}

Generally, classes you can use lots of times, ID's just one specific instance in a page.

Having said all that I don't really understand your question. Try and make it a bit clearer as to what you are trying to do.

Regards,

Max

Rookie
Offline
Regular
Last seen: 18 years 1 week ago
Timezone: GMT-4
Joined: 2004-05-19
Posts: 13
Points: 0

Layout

I'll post what I have when I get to work.