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

javascript - three.js lot of meshes optimization -

smartface.io - Proper way to change color scheme for whole application -

Email notification in google apps script -