CODEWITHSUNDEEP
htmlcss
mdeforge
mdeforge

Reputation: 874

What am I doing wrong with this CSS Layout?

I've been trying to get this to work for the last two days but have had little success. Maybe I'm getting confused with all the nested divs, who knows, but I could use someone to look at the code and point me in the right direction.

What I have: http://landgraff.com/backend/process.html

What it should look like: http://landgraff.com/process.html

The reason I'm redoing this site is because I used tables on the original, and I'm trying to get away from using tables... so that's why I'm redoing it for practice =]

The following is from: http://landgraff.com/backend/css/ProcessStylesheet.css

@charset "utf-8";

#bodytext {
    color: #6B6351;
    font-family: arial, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 14pt;
    margin: 35px 0px 0px 30px;
    width: 370px;
}

#logo {
    float: left;
    background: url(../images/logosmall.gif) no-repeat;
    width: 75px;
    height: 152px;
    text-indent: -9999px;
}

#process_title {
    clear: both;
    float: left;
    background: url(../images/process/process_title.gif) no-repeat;
    width: 75px;
    height: 347px;
    text-indent: -9999px;   
}

#header {
    float: left;
    background: url(../images/process/header.gif) no-repeat;
    width: 163px;
    height: 26px;
    text-indent: -9999px;
    margin-top: 1px;
}

Upvotes: 4

Views: 63

Answers (1)

Claudiu
Claudiu

Reputation: 3261

#bodytext {
color:#6B6351;
font-family:arial,Arial,Helvetica,sans-serif;
font-size:11px;
line-height:14pt;
margin:35px 0 0 80px;
width:395px;
}

#header {
background:url("../images/process/header.gif") no-repeat scroll 0 0 transparent;
height:26px;
margin-left:100px;
margin-top:159px;
text-indent:-9999px;
width:163px;
}

This is the way to go if you want to keep your markup and class/ids. Also, you'll have to add a tag around the last line of the copy.

It's quite ok for starters tough, good luck!

Upvotes: 1

Related Questions