ansaurus

Question

Answer 1

A:

In this case, it sounds like you want #infoBar and #coverArea to float to the right of #covers instead of #covers floating to the left of the other two.

Try taking the float off of #covers and adding float: right; to #infoBar and #coverArea

Justin Niessner 2009-09-14 13:08:01

that didn't seem to work :-(

Sir Psycho 2009-09-14 13:12:02

Did it change the behavior at all?

Justin Niessner 2009-09-14 13:21:54

Sure did, things wen't crazy. Those two divs you mentioned went to the far right and below the covers div

Sir Psycho 2009-09-14 13:25:38

I love CSS...you might also try keeping the float: left; on your #covers element while keeping the float: right; on the other two.

Justin Niessner 2009-09-14 14:23:30

Answer 2

A:

Here you go.

As a good practice, get your layout correct first before you set padding and margins.

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
    <title>Untitled Page</title>
    <style type="text/css">
        *
        {
            margin: 0;
            padding: 0;
        }
        #chooserContainer
        {
            background: #ccc;
      width: 911px;
        }

        #covers
        {
            width: 150px;
            float: left;
            height: 600px;
            overflow-y: auto;
            overflow-x: hidden;
            background-color: #0ff;
        }
        #infoBar
        {
            height: 30px;
            width: 600px;
      float: right;
      background: yellow;
        }
     #coverArea
        {
            width: 760px;
      float: right;
      background: #f60;
        }
        #actualCover
        {
            width: 794px;
            height: 600px;
        }
    </style>
</head>
<body>
    <div id="chooserContainer">
        <div id="covers">Coveres
        </div>
        <div id="infoBar">InfoBar
        </div>
        <div id="coverArea">CoverArea
            <div id="actualCover">ActualCover
            </div>
        </div>
        <div style="clear: both;"></div>
    </div>
</body>
</html>

Virat Kadaru 2009-09-14 20:37:17

ansaurus

tags:

views:

answers:

need help with this html css fragment

related questions