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 to the CF scene
    Join Date
    May 2009
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Frustrated learner ...

    Hi,

    I hope that I'm posting this in the correct place ...

    I have been trying and trying (but to no avail obviously) to code (beginner, yes) a layout using only divs and such. I have been at this for hours and hours and hours it seems!

    This is how the layout looks now: http://webgurl.atspace.com/webgurl.jpg

    As you can see, it's messed up a bit.

    I cannot for the life of me to get a navigation to show where it should, or can I get the line and footer on there ... one more thing that is really odd, why does the 'logo' image not act like any other link? (When you place your mouse over it - it stays as an arrow instead of a hand!)

    This is 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 type="text/css" href="1.css" rel="stylesheet" media="screen" />
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <body>
    <div id="header">
    <div class="left"><a href="index.html"><span class="logo left"></span></a></div>
    
    <div id="container">
    
    <h3>&nbsp;</h3></div>
    
    <div id="flash">
    
    <p>&nbsp;</p></div>
    
    
    <div id="left">
    <div id="sidebar">
    		<div class="rnd_container">
    <b class="rnd_top"><b class="rnd_b1"></b><b class="rnd_b2"></b><b class="rnd_b3"></b><b class="rnd_b4"></b></b>
    <div class="rnd_content"> 
    <span class="topic">Topic Header</span>
    </div>
    <b class="rnd_bottom"><b class="rnd_b4"></b><b class="rnd_b3"></b><b class="rnd_b2"></b><b class="rnd_b1"></b></b>
    </div>
    <br />
    <div class="rnd_container">
    <b class="rnd_top"><b class="rnd_b1"></b><b class="rnd_b2"></b><b class="rnd_b3"></b><b class="rnd_b4"></b></b>
    <div class="rnd_content"> 
    <p>&nbsp;</p>
    </div>
    <b class="rnd_bottom"><b class="rnd_b4"></b><b class="rnd_b3"></b><b class="rnd_b2"></b><b class="rnd_b1"></b></b>
    </div></div>
    
    
    </div><div id="content">
    <span class="topic">Content</span>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec porta mollis tellus quis rutrum. Pellentesque malesuada ullamcorper massa quis porttitor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur sodales varius condimentum. </p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec porta mollis tellus quis rutrum. Pellentesque malesuada ullamcorper massa quis porttitor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur sodales varius condimentum. </p>
    
    </div><div id="footer"><h1>&nbsp;</h1></div></div></body></html>
    This is my css:

    Code:
    body {background:#ffffff; font-size:12px; font-family: Verdana, Arial, Helvetica, sans-serif; }
    a {color: #DB7093;} a:visited {color:#DB7093;} a:hover {color: #564b47;}a:active { color:#000000;}
    h3 {background:url(images/lonestarbar.jpg); height: 5px;}
    .topic {font-size:14px; font-weight: bold; padding: 5px  margin:0px;}
    #header {width: 920px; margin-left: auto; margin-right: auto; background-color: #ffffff;}
    #flash {width: 920px; height: 200px; background-color: #fee5b7;}
    .logo { width:244px; height:100px; background:url(images/logo.jpg);}
    .left {float:left;}
    #container {background-color: #ffffff; text-align: center; padding: 0px;margin: 0px; width: 920px;}
    #content {background-color: #ffffff;padding: 0px;margin-left: 200px;margin-right: 0px;}
    p {padding: 5px 10px;margin:0px;}
    #left {float: left;width: 200px;margin: 0px;padding: 0px;}
    #footer {clear: both; margin: 0px;padding: 0px;text-align: right; }
    #rnd_container {background: #ffffff; margin:1px;}
        
        .rnd_top, .rnd_bottom {display:block; background:#ffffff; font-size:1px;}
        .rnd_b1, .rnd_b2, .rnd_b3, .rnd_b4 {display:block; overflow:hidden;}
        .rnd_b1, .rnd_b2, .rnd_b3 {height:1px;}
        .rnd_b2, .rnd_b3, .rnd_b4 {background:#FFFFFF; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC;}
        .rnd_b1 {margin:0 5px; background:#CCCCCC;}
        .rnd_b2 {margin:0 3px; border-width:0 2px;}
        .rnd_b3 {margin:0 2px;}
        .rnd_b4 {height:2px; margin:0 1px;}
        
        .rnd_content {
        display:block;
        border:0 solid #CCCCCC;
        border-width:0 1px;
        padding: 4px;
        background:#FFFFFF;
        color:#000000;
    }
    I really home someone can help me out ... thank you `

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    As you can see, it's messed up a bit.

    I cannot for the life of me to get a navigation to show where it should, or can I get the line and footer on there ... one more thing that is really odd, why does the 'logo' image not act like any other link? (When you place your mouse over it - it stays as an arrow instead of a hand!)
    Could you post a link to your page and explain on the basis of that? I can't reproduce any errors by the above posted code.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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