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 2 of 2
  1. #1
    New Coder
    Join Date
    May 2006
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Pulling things together!

    Well, I am trying to make a website for my church....It would look wonderful, but it's all out of wack...I have like 4 diff. div layers....
    1) a Frame
    2) a header
    3) a menu
    4) Content
    The frame, the header, and the menu layers are working wonderfully! but the content layer is like 2 inches away from everything else....you can see what I mean by following this link: http://parkplace.awardspace.com
    I also used an external stylesheet, in which you can look at by following the below link http://parkplace.awardspace.com/sylesheet.html
    The code is below:
    Code:
    <html>
    <head>
    <title>Park Place Church of God</title>
    </head>
    <body>
    <link href="stylesheet.css" type="text/css" rel="stylesheet">
    <div id="frame">
    <table width="100%">
    <tr>
    <td>
    <div id="header">
    <img src="ParkPlaceBanner.gif">
    </div>
    </td>
    </tr>
    <tr>
    <td>
    <div id="menu">
    <div id="menu2">
    <ul>
    <li><a href="#1" title="Home">Home</a></li>
    <li><a href="#2" title="About">About</a></li>
    <li><a href="#3" title="Services">Services</a></li>
    <li><a href="#4" title="Portfolio">Portfolio</a></li>
    <li><a href="#5" title="Store">Store</a></li>
    <li><a href="menu2.zip" title="Download">Download Menu</a></li>
    </ul>
    </div>
    </div>
    </td>
    <td>
    <div id="content">
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Hello and welcome to the Park Place Chruch of God website, the church that love is building.  Here at Park Place, we just want to welcome you to come and recieve the Love of God that you have never experienced elsewhere.  Please come and join us for our worship services on Sundays and Wednesdays (Scheduel Below).</p><br>
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Park Place is a Pentecostal fellowship that believes in:<br>
    <ol padding="0" margin="0">
    <li>Repentance.</li>
    <li>Justification.</li>
    <li>Regeneration.</li>
    <li>New Birth.</li>
    <li>Sanctification subsequentn to justification.</li>
    <li>Holiness.</li>
    <li>Water Baptism.</li>
    <li>Baptism wit the Holy Ghost subsequent to cleansing; the enduement of power for service</li>
    <li>The speaking in of tounges as the Spirit gives utterance as the initial evidence of the baptism in the Holy Ghost.</li>
    <li>The Church.</li>
    <li>Spiritual gifts.</li>
    <li>Signs following believers.</li>
    <li>Fruit of the Spirit.</li>
    <li>Divine healing provided for all in the Atonement.</li>
    <li>The Lords Supper</li>
    <li>Washing the saints' feet.</li>
    <li>Tithin and giving</li>
    </ol></p><br>
    <p class="scheduel">
    <ul list-style-type="none">
    <li><b>Sunday Moring:</b>10:00am</li>
    <li><b>Sunday Evening:</b>5:00pm</li>
    <li><b>Wednessday Night:</b>7:00pm</li>
    </ul>
    </p>
    </div>
    </td>
    </tr>
    </table>
    </div>
    </body>
    </html>

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,667
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello chaseinchrist,
    Not so bad for a first attempt but your table inside #frame is too big, you don't have a DocType... see what the validator has to say.

    Try this, just for a start:
    Code:
    body {
      background: #151B54;
      color: #151B54
     }
    * {
    margin: 0;
    padding: 0;
    border: none;
    }
    .scheduel {
      align: center;
      border:1px solid black;
     }
    
    ul {
      list-style-type: none;
      padding:0;
      margin:0;
     }
    
    #frame {
      border: 1px solid black;
      width: 800px;
    overflow: hidden;
      background: white;
     }
    
    #header {
      width: 800px;
      height: 200px;
      border: 1px solid black;
    }
    
    #menu {
      width:214px;
    float: left;
      border: 1px solid black;
    }
    
    #content {
      width:580px;
    float: left;
      border: 1px solid black;
    }
    /* =-=-=-=-=-=-=-[Menu Two]-=-=-=-=-=-=-=- */
    	
    #menu2 {
    	width: 200px;
    	border-style: solid solid none solid;
    	border-color: #677D92;
    	border-size: 1px;
    	border-width: 1px;
    	margin:10px;
    	}
    	
    #menu2 li a {
    	height: 32px;
      	voice-family: "\"}\""; 
      	voice-family: inherit;
      	height: 24px;
    	text-decoration: none;
    	}
    	
    #menu2 li a:link, #menu2 li a:visited {
    	color: #fff;
    	display: block;
    	background: url(images/menu2.gif);
    	padding: 8px 0 0 10px;
    	}
    	
    #menu2 li a:hover {
    	color: #283A50;
    	background: url(images/menu2.gif) 0 -32px;
    	padding: 8px 0 0 10px;
    	}
    	
    #menu2 li a:active {
    	color: #283A50;
    	background: url(images/menu2.gif) 0 -64px;
    	padding: 8px 0 0 10px;
    	}
    Code:
    <html>
    <body>
    <div id="frame">
    <div id="header">
    <img src="http://parkplace.awardspace.com/ParkPlaceBanner.gif">
    </div>
    <div id="menu">
    <div id="menu2">
    <ul>
    <li><a href="#1" title="Home">Home</a></li>
    <li><a href="#2" title="About">About</a></li>
    <li><a href="#3" title="Services">Services</a></li>
    <li><a href="#4" title="Portfolio">Portfolio</a></li>
    <li><a href="#5" title="Store">Store</a></li>
    <li><a href="menu2.zip" title="Download">Download Menu</a></li>
    </ul>
    </div>
    </div>
    <div id="content">
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Hello and welcome to the Park Place Chruch of God website, the church that love is building.  Here at Park Place, we just want to welcome you to come and recieve the Love of God that you have never experienced elsewhere.  Please come and join us for our worship services on Sundays and Wednesdays (Scheduel Below).</p><br>
    <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Park Place is a Pentecostal fellowship that believes in:<br>
    </p><ol padding="0" margin="0">
    <li>Repentance.</li>
    <li>Justification.</li>
    <li>Regeneration.</li>
    <li>New Birth.</li>
    <li>Sanctification subsequentn to justification.</li>
    <li>Holiness.</li>
    <li>Water Baptism.</li>
    <li>Baptism wit the Holy Ghost subsequent to cleansing; the enduement of power for service</li>
    <li>The speaking in of tounges as the Spirit gives utterance as the initial evidence of the baptism in the Holy Ghost.</li>
    <li>The Church.</li>
    <li>Spiritual gifts.</li>
    <li>Signs following believers.</li>
    <li>Fruit of the Spirit.</li>
    <li>Divine healing provided for all in the Atonement.</li>
    <li>The Lords Supper</li>
    <li>Washing the saints' feet.</li>
    <li>Tithin and giving</li>
    </ol><p></p><br>
    <p class="scheduel">
    </p><ul list-style-type="none">
    <li><b>Sunday Moring:</b>10:00am</li>
    <li><b>Sunday Evening:</b>5:00pm</li>
    <li><b>Wednessday Night:</b>7:00pm</li>
    </ul>
    <p></p>
    </div>
    </div>
    </body>
    </html>
    You still need a DocType. See the link in my sig below.
    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
    •