I'm in the process of playing with HTML and CSS. I have the following at the moment:
Code:
/*Reset margins & padding*/
body, h1, h2, h3, h4, h5, h6, p, div, ul, li {
* * margin: 0;
* * padding: 0;
}

body {
* * background: #CCCCCC;
* * font-family: sans-serif;
* * color: #000;
}

#divWrapper {
* * width: 90%;
* * margin: 0 auto;
}

#divHeader {
* * width: 100%;
* * background: #CC0000;
* * text-align: center;

* * /* Margins */
* * margin-top: 20px;
* * margin-bottom: 0px;

* * /* Radius */
* * border-radius: 5px;
}

#divMenuStrip {
* * width: 100%;
* * background: #646464;
* * text-align: center;

* * /* Margins */
* * margin-top: 10px;

* * /* Padding */
* * padding-left: 5px;
* * padding-right: 5px;


* * /* Radius */
* * border-radius: 5px;
}

#divContent {
* * width: 100%;
* * background: #ffffff;

* * /* Margins */
* * margin-top: 10px;

* * /* Padding */
* * padding: 8px;

* * /* Radius */
* * border-radius: 5px;
}
AND...
Code:
* * <!DOCTYPE html>
*<html>
* * <head>
* * * * <link rel="stylesheet" type="text/css" href="./styles/main.css">
* * </head>

* * <body>
* * * * <div id="divWrapper">

* * * * * * * * <div id="divHeader"><img src="./images/headers/header-1.jpg" /></div>
* * * * * * * * <div id="divMenuStrip">This is where the menu will be displayed</div> **
* * * * * * * * <div id="divContent">This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. This is where the content will be displayed. </div>
* * * * </div>
* * </body>
</html>
When I load up the HTML page in my web browser it appears as though depending on the amount of content within the div tags that are text are affecting my div tag's width. I am told that this is normal and that div tags expanded based on content. What is recommended from here on in? I want to put a vast amount of information in the white area. But the format is changing based on content. How can this be rectified?*

I want the width of the div tags to be 90% of the screen res but not wider. The divs inside the wrapper are 100% of what their parent object is. Is this correct?

Can anybody shed light as to why this is? Thanks!!!