Mattia Semprini Mattia Semprini - 1 month ago 7
CSS Question

CSS with border and margin issue

hello guys i'm trying to add some space between boxes in my list when resize the page, i'm new with css, help me :D
my problem



nav{
border: solid;
border-color: black;
}
ul li
{
margin-bottom: 11px;
display: inline;
font-weight: 900;
border: solid;
border-color: black;

}
nav ul li{
color: black;
text-decoration: none;
padding: auto;
padding-right: 80px;
padding-left: 80px;
}

<nav>
<ul>
<li>List</li>
<li>Contact Us</li>
<li>Shopping Cart</li>
<li>Login</li>
</ul>
</nav>




Answer

nav{
  border: solid;
    border-color: black;
}
ul li
{
    margin-bottom: 11px;
    display: inline;
    font-weight: 900;
    border: solid;
    border-color: black;
    display:inline-block;
}
nav ul li{
    color: black;
    text-decoration: none;
    padding: auto;
    padding-right: 80px;
    padding-left: 80px;
}
<nav>
    <ul>
        <li>List</li>
        <li>Contact Us</li>
        <li>Shopping Cart</li>
        <li>Login</li>
    </ul>
</nav>

just add display:block to the li element

Comments