5 Replies Latest reply on Jun 3, 2010 11:58 AM by håvardnoren

    Can't place my links where I want them

    håvardnoren

      Hello,

       

      I'm trying to align my links in the #header using the padding command. The problem is when I try to align the links whit padding-top and padding-bottom, nothing happens.

      I thought that maby the padding command counted px from the top of my webpage rather than the top of my #header and I tried to increase the px accordingly, but that didn't help either. Also could it maby be a better/other way to place my links where I want them without the use of paddig?

       

      Here's my css document:

       

      @charset "utf-8";
      /* CSS Document */
      body {
       font:"agency FB";
      
      }
      
      a{ 
       padding:92px 26px 38px 42px;
       font-size:28px; 
      }
      
      #page{
       background:#d8d8d8;
       position:absolute;
       top:0px;
       left:0px;
       width:1024px;
       height:768;
      }
      #top{
       background:#d8d8d8;
       position:absolute;
       top:0px;
       left:0px;
       width:1024px;
       height:142px;
       }
      #header{
       background-image:url(Images/Header.jpg);
       position:absolute;
       top:142px;
       left:0px;
       width:1024px;
       height:158px;
       
       
      }
      #bottom{
       background:#d8d8d8;
       position:absolute;
       top:300px;
       left:0px;
       width:1024px;
       height:468px;
      }
      #venstre{
       background-color:#FFF;
       position:absolute;
       top:28px;
       left:33px;
       width:608px;
       height:357px;
      }
      #hoyre{
       background-color:#FFF;
       position:absolute;
       top:28px;
       left:667px;
       width:323px;
       height:430px;
      }
      
      


      Here's 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>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>Webside</title>
      <link href="Stilark.css" rel="stylesheet" type="text/css" />
      </head>    
      <body>
      <div id="page">
       <div id="top">
         
          </div>
          
          <div id="header">
       
          <a href="Webside.html">Home</a>
          
          <a href="Webside.html">Gimmy</a>
          
          <a href="Webside.html">Carina</a>
          
          <a href="Webside.html">Bilder</a>
          
          <a href="Webside.html">Linker</a>
          
          
      </div>
          
      <div id="bottom">
            
            <div id="venstre">
      </div>
              
           <div id="hoyre">
        
           </div>
         
      </div>
      </div>
          
      </body>
      </html>