-4

I am starting to learn Web Development from scratch other than using drag and drop Hence i wanted to ask something like this , As a newbie.

Now this takes the code to the Left hand side of the screen for navigation works fine here.

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Home</title>
</head>
 <link rel="stylesheet" type="text/css" href="style.css">
<body>

<div align="center">
    <table border="0" width="93%">
        <tr>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td><h1>Test</h1></td>
        </tr>
        <tr>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>
            <div class="left">
            <ul class="nav">
            <li class="selected"><a href="#">Home</a></li>
             <li><a href="#">About</a></li>
            </ul>
            </div>
            <div class ="center">
            </div>
            </td>
        </tr>
    </table>
    <p>&nbsp;</div>

</body>

</html>

CSS

@charset "utf8";
/*CSS Document*/

*{
    padding:0px;
    margin :0px;
}

h1{
    font-family : arial, sans-serif;
    font-weight:400;
    height:60px;
    width:100%
    background-color:black; 
    line-height:60px;
    color: white;
}

div{
    width:250px;
    height:666px;
    background:#1a1a1a;

}

div a{
    text-decoration:none;
    color:white;
    padding: 20px;
    padding-right:100px;
}

div ul li{
    list-style-type:none;
    display:block;
    padding:15px;
    border-bottom: 1px solid #CCC;
}

div ul li:hover{
    background:#bfbfbf;
    transition:linear all 0.40s;
    margin-left:10px;
}

div ul li a:hover{
    color:black;
}

.selected{
    background:white;
}

.selected a{
    color:black;
}
Marcus
  • 1
  • 2

1 Answers1

0

Give margin: 0 auto, then position: absolute and finally left: 0, right: 0 to your class.

Abhigyan Tiwari
  • 97
  • 3
  • 14