SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member lancewatson's Avatar
    Join Date
    Jul 2010
    Location
    Grand Rapids, Michigan, United States
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    css layout problems

    I am trying layout this site to the following specs. The aside 2 is being a little cranky, header2 and main are not reponsive!

    container 1000px.
    header- 1000 px width that will have sub containers I have not started on yet. They will be logo, social media and nav.
    aside- 250 px floated left
    aside 2- 250px floated right
    header 2- 500px in the center
    main- 500px in the center below header 2
    footer 1000pxlo1.jpg

    html code:
    Code:
    <!DOCTYPE html>
    <html lang="en" class="no-js">
    
    
    <head>
    
    	<meta charset="utf-8">
    	
    	<title>UAW 1002 Middleville, Michigan 49333 </title>
        <meta name="description" content="Bulldog Web Development is a web design company,s  tn from Grand Rapids, Michigan." >
        <meta name="keywords" content="custom web design, web design,  " >
    	
    	<link rel="stylesheet" href="styles.css" media="all">
        
        <script src="js/modernizr-1.7.min.js"></script>
    	
    	
    	
    
    </head>
    <div id="wrapper">
    <body>
    
    <header>
    	header
    	
    
    </header>
    
    <aside>aside</aside>
    <div id"header2">header2</div>
    
    <div id"main">main</div>
    
    <div id"aside2">aside2</div>
    
    <footer>
    <p>footer</p>
    </footer>
    
    <script type="text/javascript" src="js/general.js"></script>
    </body>
    </div>
    </html>
    CSS CODE:
    Code:
    @charset "utf-8";
    /* CSS Document */
    
    #wrapper{
    margin: 0 auto;
    width: 1000px;
    height: 1000px;
    
    	}
    
    header{
    float:left;
    width: 1000px;
    height: 100px;
    background-color:red ;
    
    	
    	}
    
    aside{
    float:left;	
    width: 250px;
    height: 500px;
    background-color:blue ;	}
    
    #header2{
    float:left;	
    width: 500px;
    height: 500px;
    background-color: green ;
    margin: 1px;	}
    
    #main{
    float:left;
    width: 500px;
    height:300px;
    background-color: blue;}
    
    #aside2{
    float: left;
    width: 225px;
    height: 600px;
    background-color: red;
    margin-right: 0 ;
    	}
    
    footer{
    float:left;
    width: 1000px;
    height: 300px;	}
    Last edited by Paul O'B; Nov 20, 2011 at 04:10. Reason: code tags added

  2. #2
    SitePoint Member lancewatson's Avatar
    Join Date
    Jul 2010
    Location
    Grand Rapids, Michigan, United States
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I am officially an idiot. When I did my DIV tags. I did not use a = in it.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,526
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    lol - glad you spotted it


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •