1

Topic: CSS problem: Please Help!

Hi All ...

Hoping a CSS guru can help me out here. {Paul??  anyone? smile}

I have 4 images: leftheader, middle, and right with a logo.

Since div's are block level elements, I'm not able to figure out the right formula for getting everything all in one line, so-to-speak. ie: rather than going on one line to form the header, they stack. sad


Style:

body {
    margin: 30px;
    font: 12px Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
    line-height: 1.4em;
    color: #ececec;
    background: #B7BCC3 url(images/bck.jpg) repeat-x;
}

#left {
    height: 77;
    margin-bottom: 0;
    position: relative;
    background: transparent url(images/header-left.png) no-repeat left top;
}

#middle {
    height: 77;
    margin-bottom: 0;
    position: relative;
    background: transparent url(images/header-middle.png) repeat-x center top;
}

#right {
    height: 77;
    margin-bottom: 0;
    position: relative;
    background: transparent url(images/header-right.png) no-repeat right top;
}

#logo {
    float: left;
    margin-left: 8px;
    width: 395px;
    height: 77px;
    background: transparent url(images/logo.png) no-repeat top left;
}


HTML page:

<div id="container">

<div id="left"> </div>

<div id="middle"> <div id="logo"> </div> </div>

<div id="right"> </div>
     
</div>


Can someone tell me the right way to phrase the style sheet so this works correctly?  Any Help would be appreciated tremendously.

TIA!!

Re: CSS problem: Please Help!

try instead using px  as size em, that had  helpded my in figuring out to get things in a line.

The poor horseman without horses
www.galopp-sport.eu

http://claimid.com/jlangrock
[img]http://claimid.com/images/hcard.gif[/img]

3

Re: CSS problem: Please Help!

jlangrock wrote:

try instead using px  as size em, that had  helpded my in figuring out to get things in a line.

I believe using em allows you to scale the page {ie: browser}. No?

Re: CSS problem: Please Help!

Moved, not really PunBB discussion.

5

Re: CSS problem: Please Help!

Anyone? smile

6

Re: CSS problem: Please Help!

Just floating one div isn't going to do it. To get divs to line up you need to float all of them or all of them except the last one in the source code.

7 (edited by Raybo 2006-12-26 21:12)

Re: CSS problem: Please Help!

I should of prefaced this with stating I've tried every conceivable combination of divs, floats, left, right, .... I've also tried playing with different combinations of ordering the divs on the html page.

All no Joy sad


Can you give a demo?  Puhleez? smile

Thanks so much!