0
/* Main CSS of the Adam McKerlie site coded by Goldfish Graphics in the month of Aug. 2007*/
body {
/*This takes care of cross browser problems by making no defualt margin or padding*/
margin:0;
padding:0;
/*These are the basic fonts the browser will use for the site. If the user doens't have them on their computer it will go from right to left untill it reaches default or "serif"*/
font-family: Tahoma, "Arial Unicode MS", Arial, sans-serif, serif;
/*em is another unit for web text size like px or %*/
font-size: .8em;
/*Defualt Text Color*/
color: #000000;
/*Take all borders away from pictures*/
border-width: 0px;
/*Sets background color for whole page*/
background-color: #b0cfe1;
}
#container {
width: 750px;
/*Centers the page in the browser but doens't work for IE5/WIN*/
margin: auto;
background-color: #ffffff;
}
#header {
/*Code for the header or banner goes hear*/
/*Centers the header inside the container div*/
margin-left: 4px;
/*Puts the small margin or space between the navigation and header*/
margin-bottom: 2px;
}
#navigation {
/*Centers the header inside the container div*/
margin-left: 4px;
/*Puts the small margin or space between the navigation and content*/
margin-bottom: 2px;
}
/*CONTENT BOX ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
#conttop {
background-image: url(Images/contentt.jpg);
margin-left: 4px;
background-repeat: no-repeat;
height: 5px;
width: 743px;
}
#content {
background-image: url(Images/content.jpg);
margin-left: 4px;
width: 742px;
min-height: 278px;
}
/*CONTENT BOX ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
/*CLASSES & DIV^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.contentparagraph {
color: #000000;
margin: 0 10px 10px 15px;
padding-top: 6px;
}
the class contentparagraph above goes outside of the content box so it runs off the page. I figured I would put a width on it. So I would have .contentparagraph {
color: #000000;
margin: 0 10px 10px 15px;
padding-top: 6px;
width: 100px; (Just an example)
}
But that doesn't work. Neither does max-width. Does anyone know why or how to fix that?
Hear is my xhtml.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta name="keywords" content="A McKerlie"> <meta name="description" content="Portfolio"> <!-- Put the name of your site between the title tags and it will apear in the browser heading bar --> <title>ssssss</title> <!-- Links to your main style sheet --> <link rel="stylesheet" type="text/css" href="main.css"> </head> <body> <!-- Div for the whole layout --> <div id="container"> <!-- ^^^^^^^^^^^^^^^^^^^^^^^^ --> <div id="header"> <!-- HEADER CODE --> <img src="Images/header.jpg" alt= "Banner and title of site" /> </div> <!-- ************************ --> <div id="navigation"> <!-- NAVIGATION CODE --> <img src="Images/navigation.jpg" alt= "Navigation including Home, Blog, Portfolio, About, Contact" /> </div> <!-- ************************ --> <div id="conttop"> <!-- PUT MAIN COLUMN_T CODE HERE --> </div> <!-- ************************ --> <div id="content"> <!-- PUT MAIN COLUMN CODE HERE --> <!-- PUT YOUR MAIN HEADING FOR THE PAGE AND CONTENT BETWEEN THE HEADING TAGS <H> AND THE PARAGRAPH TAGES <P> --> <h2 class="contentparagraph">Hello</h2> <p class="contentparagraph">asdfsdfasdfasdfasdasdddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd ddddddddddddddddd</p> </div> <!-- ************************ --> <div id="content_b"> <!-- PUT MAIN COLUMN_B CODE HERE --> </div> <!-- ************************ --> <div id="footer"> <!-- PUT FOOTER CODE HERE --> </div> <!-- Closing container div --> </div> <!-- ^^^^^^^^^^^^^^^^^^^^^^^ --> </body> </html>
Also do you see any other problems with my code that are because of my lack of knowlege? I am sure I have other mistakes in the code, I am just not smart enough to find them.
