I'm having trouble positioning divs.  There are two major parts of
this page - the immovable header and the movable content.  The header
contains a logo on the left, a subtitle in the center (left aligned to
the logo), and a search bar on the right.

Besides this, the content div only goes down as far as the content.
I'd like it to fill the viewport even when there is little content.

This website is internal and will only be viewed on Firefox browsers.
I've convinced the corporation that IE is bad for business, except in
certain cases where they need to view a website that is designed for
IE, which is few if any.

The URL: http://four.fsphost.com/thpublic/

The CSS:

* {margin: 0; padding: 0;}

html, body, {
        width: 100%;
        height: 100%;
        font: 0.8125em Verdana, sans-serif;
        line-height: 1;
        color: rgb(244, 242, 219);
        background-color: rgb(30, 23, 14);
        }



#header {
        background-color: #1E170E;
        border-bottom-style: solid;
        border-bottom-width: 5px;
        padding: 10px;
        background-color: rgb(30, 23, 14);
        background-image: url("layout/gradient-dark1.jpg");
        background-repeat: repeat-x;
        color: white;
        position: fixed;
        height: 7em;
        top: 0;
        width: 100%;
        }

#logo      {
        position: relative;
               float: left;
        }

#header p {
        font-family: Courier New,Courier,monospace;
        font-weight: bold;
        font-size: 1em;
        letter-spacing: .25em;
        padding: 1em;
        }
        
#search {
        width: 5em;
        background-color: rgb(80, 71, 65);
        font-size: 0.5em;
        }
        
fieldset { width: 5em; }

#content {
        font: 0.8125em Verdana, sans-serif;
        background-color: rgb(30, 23, 14);
        color: rgb(244, 242, 219);
        margin-top: 10em;
        padding-top: 10px;
        }

        
.companyname1,
.companyname2 {
        color: rgb(255, 255, 255);
        font-style: normal;
        font-family: Times New Roman,Times,serif;
        text-align: center;
        line-height: .75em;
        }

.companyname1 {
        font-size: 2em;
        font-weight: bold;
        }

.companyname2 {
        font-size: .75em;
        font-weight: normal;
        }






The HTML:

<body>
<div id="wrapper">
<div id="header">

<div id="logo">
<h1 class="companyname1">companyname1<br/><span
class="companyname2">companyname2</span></h1>
</div>

<p>subtitle</p>

<div id="search">
<fieldset>
<input id="searchInput" type="text" />
<button id="performSearch">search</button>
</fieldset>
</div>
</div><!--header-->

<div id="content">
Content or <table>
</div>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to