SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2007
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Help!!!!!! Newbie

    Hi I was wondering if anyone can help me I am trying to get my navigation to appear horizontal across the page but still stays as a html list can anyone help me please! would be very greatful.


    My Html
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    
    <link href="StyleSheet1.css" rel="stylesheet" type="text/css">
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Dragons Den</title>
    <style type="text/css">
    <!--
    .style1 {color: #0033CC}
    .style2 {font-size: 10px}
    -->
    </style>
    </head>
    
    <body>
    <div id="container">
    
    <div id="banner" >
    <div id=container2>
    
    <div id="navbar">
    <ul>
    <li><a href="#">About Us</a></li>
    <li><a href="#">Entrepreneurs</a></li>
    <li><a href="#">Investors</a></li>
    <li><a href="#">Help</a></li>
    </ul>
    </div>
    
    
    <div id="content">
    
    <div id="welcome">
    
    <div id="premble">
      <p>Dragons Den gives entrepreneurs the chance to pitch their ideas to a panel of successful business people. They have pledged to invest their own money in new ideas.</p>
      <p>If you are a entrepreneur with a fantastic new money makeing idea that is investment ready then register now</p>
    </div> 
    <div id="loginAreaBG">
    
    <div id="loginArea">
    
    <form name="form1" method="post" action="" id="genericForm">
    <fieldset>
    <div><label for="UserName">User Name</label><input name="UserName" type="text" size="8" id="UserName"></div>
    <div><label for="PassWord">Password</label><input name="PassWord" type="text" size="8" id="PassWord"></div>
    <div class="submit"><input type="submit" name="Submit" class="btn" value="Login"></div>
    </fieldset>
     </form>
    </div>
    
    
    
    
    
    
    </body>
    </html>
    Code:
    css
    
    
    
    @charset "utf-8";
    /* CSS Document */
    
    
    /* Positioning Divs */ 
    
    #container{
    position: relative;
    margin: 0 auto;
    width: 770px;
    height: 500px;
    background-color: #CCCCCC;
    }
    
    #banner{
    	position: absolute;
    	left: 0px;
    	top: 0px;
    	width: 770px;
    	height: 150px;
    	background: url(U:\Online Business Systems/dragon1.jpg) no-repeat top left;
    	background-color: #1a2523;
    	
    }
    nav here
    
    	#container2 { 
    	position: absolute;
    	left: 0px;
    	top: 150px;
    	width: 770px;
    	height: 110px;
    	background-color: #999999;
    		
    }
    #navigation {
    font-size:50&#37;;
    }
    
    #navigation ul {
    list-style:none;
    margin: 0;
    padding: 0;
    padding-top: 1em;
    }
    #navigation li {
    display: inline;
    }
    #navigation a:link, #navigation a:visited {
    padding 0.4em 1em 0.4em 1em;
    color:#999999
    background-color: #FF0000
    text_decoration:none;
    border: 3px solid #711515;
    }
    navigation a:hover {
    color: #ffffff
    background-color: #711515;
    }
    
    
    
    #content{
    	position:absolute;
    	left: -2px;
    	top: 110px;
    	width: 770px;
    	height: 307px;
    	background-color: #1a2523;
    }
    
    #welcome{
    	position: absolute;
    	left: 52px;
    	top: 5px;
    	width: 150px;
    	height: 283px;
    	text-align: center;
    	font: 16px Tahoma;
    	font-weight: bold;
    	background-color: #D6E3FE;
    }
    
    #premble{
    	position: absolute;
    	left: 288px;
    	top: 16px;
    	width: 400px;
    	height: 135px;
    	text-align: center;
    	font: 12px Tahoma;
    	background-color: #D6E3FE;
    	overflow: scroll;
    }
    
    #loginArea{
    	position: absolute;
    	left: 17px;
    	top: 160px;
    	width: 124px;
    	height: 113px;
    	text-align: left;
    	font: 12px verdana, sans-serif;
    	}

  2. #2
    SitePoint Member
    Join Date
    Nov 2007
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <div id="navbar">

    #navigation

    They seems to have same name...

  3. #3
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,806
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi maccy_gee and welcome to the forums

    I have moved your post to the CSS forum where you should get a better response. I have also added the [code][/code] tags to make the code mode compact and readable.

    Regards

    Spike
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  4. #4
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Change the div id="navbar" to have an ID of "navigation"
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  5. #5
    SitePoint Enthusiast
    Join Date
    Dec 2007
    Posts
    66
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys sorted


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
  •