Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Fix my Beginners Web Page

    OK, I'm soo new to this but i'm trying my hardest to build a web site from scratch. I laid out the page how i think it should be done...

    Ive put in a header, and a wrapper with three coloums (RGB), inside these coloum i'd like to put modules that i create, then add in php and what later... its just the layout im doing the now. please have a look help with any tips, and fixes.

    http://www.snapse.net/tempsite

    My problems so far are...

    1. I cant space inbetween the modules, eg. Left Module 1 & 2. for some reason the margin top and bottom have no effect.

    2. I cant get "Content Module Split 1 & 2" to stay on the same line, clear: both has no effect?

    Here is the CSS...

    Code:
    #module
    {
    	float: left;
    
    	margin: 0px 0px; padding: 10px;
    	background: black;
    
    	border: 2px solid cornflowerblue;
    	border-top-left-radius: 15px;
    	border-top-right-radius: 15px;
    	border-bottom-left-radius: 15px;
    	border-bottom-right-radius: 15px;
    }
    
    .moduleSide
    {
    	clear: both;
    	width: 205px;
    }
    
    .moduleMain
    {
    	clear: both;
    	width: 685px;
    }
    
    .moduleSplit
    {
    	width: 300px;
    }
    What am I not doing to make this work?

    PS, this is the only way i know how to present this, any help if you's can?

  • #2
    New Coder
    Join Date
    Nov 2011
    Posts
    30
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Try this...

    Code:
    * {
    	margin: 0;
    	padding: 0;
    }
    
    #module
    {
    position: relative;
    margin: 0px auto;
    border: 2px solid cornflowerblue;
    border-radius: 15px;
    width: 1190px;
    }
    
    .moduleSide
    {
    float: left;
    clear: both;
    width: 205px;
    
    }
    
    .moduleMain
    {
    float: left;
    clear: both;
    width: 685px;
    }
    
    .moduleSplit
    {
    float: left;
    width: 300px;
    }
    This is similar to how I got mine to work, though I used divs extensively, so it would have been "div.moduleSplit", etc, and each column would have been set as a div, with an <div class="moduleSplit"></div> code, for example. I also mixed two of the methods used for two different iterations of the webpage, based on how much of it was done in HTML, and how much of it was inside the style tags, but I think it should work with it like that, all lined up in CSS.

  • #3
    New Coder
    Join Date
    Oct 2011
    Posts
    13
    Thanks
    6
    Thanked 0 Times in 0 Posts
    that didnt work either...?

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,746
    Thanks
    22
    Thanked 1,838 Times in 1,822 Posts
    Hello seminaljim,
    Start with the validator - http://validator.w3.org/check?verbos...%2Ftempsite%2F

    See the links about validation in my signature line. There is a link there about DocTypes as well.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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