Jump to content

BACKGROUND COLOR


mindapolis

Recommended Posts

on http://siteservicesunlimited.com/homepage.php how can I get the whole header to be that light green?  I even tried making the companyInfo dv that light green but it didn't help. 

 

<?php
require_once("functions.php");
?><!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
    <title>Untitled Document</title>
    <!--meta description -->
    <link rel="stylesheet" href="siteServices.css">
    <!--[if It IE 9]>
    <script src="http://html5shiv.googlecode-.com/svn/trunk/html5.js">
    </script>
    <![endif]-->
<style type="text/css">

#skills {
width:750px; 
font-size:  18px; 
text-align:center; 
background: -moz-radial-gradient(#FFFFFF, #B8B8B8);
background: -ms-radial-gradient(#FFFFFF, #B8B8B8);
background: -webkit-radial-gradient(#FFFFFF, #B8B8B8);
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 50px;
    border-radius: 100px / 50px;
}
</style>
<script type="text/javascript" language="javascript">
var slideArray = new Array()
slideArray[0]= "Web Design";
slideArray[1]= "Website Maintenance";
slideArray[2]= "Article Writing";
slideArray[3]= "Internet Research";
slideArray[4]=  "Blogging";
function textSlideShow()
{
var total_slides;
total_slides=Math.floor(Math.random()*slideArray.length)
document.getElementById('div_display').innerHTML=slideArray[total_slides];
setTimeout("textSlideShow()",800);
}
</script>
</head>

<body>
<div id="mainContent">
<div id="companyInfo">
    <header>
           <?php logo(); ?>
        <nav>
            <?php menu(); ?>
        </nav>
     </header>
</div>
<table id = "skills">
<tr>
<td>
<div id="div_display"><script type="text/javascript" language="javascript">textSlideShow();</script></div>
</td>
</tr>
</table>
     <footer>
        <?php  contactInfo(); ?>
     </footer>
</div>
</body>
</html>

 

body {
background-color:#8fbc8f;
}
header, nav {
background-color:#8FBCA6; 
}
#mainContent {
width: 750px;
margin-right: auto;
margin-left: auto;
}
.menuChoice {
display: inline;
list-style-type: none;
}
nav {
float: right;
}


Link to comment
Share on other sites

if you mean that it extends from flush left to flush right of the browser, then your problem is your #mainContent width specified.

 

I still don't know why you're using a table for your rotating text

 

You should use <em>all</em> instead of <i>all</i> as you are emphasizing a word.

Link to comment
Share on other sites

When you float an element, you are removing it from the normal flow of spacing and alignment on the page, including the natural height of the parent container.  By removing the float from your <nav> element, and applying a text-alignment: right, the desired effect can be achieved without removing modifying the document flow.

Link to comment
Share on other sites

try wrapping your header and nav tag like this.

 

<body>
<div id="mainContent">
<div id="companyInfo">
    <dive id = "header">
           <?php logo(); ?>
        <div id="nav">
            <?php menu(); ?>
        </div>
     </div>
</div>
<table id = "skills">
<tr>
<td>
<div id="div_display"><script type="text/javascript" language="javascript">textSlideShow();</script></div>
</td>
</tr>
</table>
     <footer>
        <?php  contactInfo(); ?>
     </footer>
</div>
</body>

 

then apply the css attributes to the ids identfied in the header div and nav div .

Link to comment
Share on other sites

  • 4 weeks later...
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.