Absolute Positioning Question...ugh..

**NoAssmblyReqdGA** · 10-30-2008 11:05 AM

Hi everyone,

I've been trying to follow along with a CSS training book and have run into some trouble. The author explains how to position two divs side by side using absolute positioning... as:

html {
text-align: center;}

body {
width: 798px;
margin: 0px auto;
position: relative;
text-align: left;}

div#content {
position: relative;
width: 100%;}

div#mainData {
position: absolute;
width: 50%;
left: 0;
}

div#secondaryData {
postion: absolute;
left: 50%;
width: 50%;
}

The HTML looks like this:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>absolute positioning</title>
<link href="layout.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="content">
<div id="mainData">
Test Data 1
</div>
<div id="secondaryData">
Test Data 2
</div>
<div id="siteInfo">
Footer Information
</div>
</div>
</body>
</html>

divs "mainData" and "secondaryData" live inside the "content" div. However when I view in any major browser, the two divs just overlap each other. I've been trying this one out for a few days now, so that I can move on!

Any help or insight would be appreciated.

Thanks!

**coothead** · 10-30-2008 12:13 PM

Hi there NoAssmblyReqdGA,

you have a typing error here...

Code:


div#secondaryData {
postion: absolute;
left: 50%;
width: 50%;
}

coothead

**NoAssmblyReqdGA** · 10-30-2008 12:18 PM

bleh...thanks mate! I think i'm having one of those weeks.

**coothead** · 10-30-2008 02:03 PM

Hi there NoAssmblyReqdGA,

I often miss out the first "i" in position.

If you make use of the validators...

...when you meet a problem, one or other will pick up on typos.

coothead

**Shorts** · 10-30-2008 02:28 PM

Indeed coothead, validators rock. All the times it pointed out that I've left renegade tags somewhere! Pretty much anytime something looks 'jacked' the first thing I check out is validation.

Thread: Absolute Positioning Question...ugh..

Thread Tools

Display

Absolute Positioning Question...ugh..

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions