Menu
I want to remove the space (marked as yellow) before the li tag and i don't know how.
I read other questions about this issue but it doesn't help me, I tried to add margin:0px
this is a screenshot that describes the problem:
<html dir="rtl">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1255">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<style type="text/css">
*
{
font-size:13pt;
font-family:Arial;
}
hr {
border:1px; Border-Style: solid; border-color: D8D8D8;
}
.menu ol,ul{list-style:none; }
.menu ul li{ display:block; }
.menu{
}
.menu a{
background:#f9f9f9;
border-bottom:1px solid #eee;
display:block;
padding:13px;
color:#767676;
font-size:12px;
}
.menu a:hover{
background:#fff;
}
header .menu{
border-top:1px solid #eee;
}
header .menu a{
padding:15px 15px 15px 25px;
}
header .menu li:last-child a{
border-bottom:none;
}
a:link, a:visited, a:active {color: #033254 }
a:hover{color:E19E21} a{text-decoration:none}
</style>
<body bgcolor='#FDFDF7' leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<ul class="menu">
<li><a href="eeee">aaaaaa</a></li>
<li><a href="eeee">aaaaaa</a></li>
<li><a href="eeee">aaaaaa</a></li>
<li><a href="eeee">aaaaaa</a></li>
</ul>
388
The padding-left:0 is used to remove indentation (space) from left. The list-style: none property is used to remove list-style property from the list of items.
Tricks to Remove the Space Between Inline-Block ElementsCreate a <ul> tag, which is used for specifying an unordered list. The <ul> tag is a block-level element. Create <li> tags. Each element of an unordered list is declared inside the <li> tag.
Remove white space using font-size We can also remove white space by setting parent element font-size to 0 and child elements font-size to 17px .
set padding-right: 0; on your ul
.menu {
padding-right: 0;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
