html - List isn't centering and wraps when the page exceeds 1 page of content -


here's code :

ul {      width: 100%;       position: relative;      left:10%;      margin: 0;      padding-left: 100px; }  li {     float:left;     box-align:right; }  li {     display: block;     width: 265px;     background-color: #800000;     color: #fff;     text-align: center;     font-weight: bold;     text-transform: uppercase;     padding: 5px;     border-right: 1px solid;     border-left: 1px solid; }  #list {     background-color: #800000;     padding: 0.02px 0;     margin-bottom: 10px;     overflow: hidden;     width:70%;     text-align:center;     clear:left; } <ul>   <center>      <li><a href="homepage.html">introduction</a></li>      <li><a href="biography.html">biography</a></li>      <li><a href="songs.html">brand new</a></li>      <li><a href="pictures.html">pictures</a></li>    </center>  </ul> 

so i've tried playing float, width, text-align, box-align, , position no avail. i'm trying make simple navigation list boxes stretch across width of page. noticed when acquired page of content list wraps. believe might have percentages. i'm not sure though. appreciated.


Comments

Popular posts from this blog

c++ - Difference between pre and post decrement in recursive function argument -

php - How can I echo out this array? -

javascript - IE11 incompatibility with jQuery's 'readonly'? -