CODEWITHSUNDEEP
htmlcss
Kevin
Kevin

Reputation: 37

making 100% li width in a vertical

can someone help me with my problem , i want to make a li take 100% Width of a Div

right now it looks like this

pic1

i want it to take 100% of the width of blue panel when i hover to it , can someone help me with this problem?

the Blue Panel css

.sideservice{
width : 20%;
height : 100%;
background-color: rgba(72,61,180,0.8);
position: absolute;
top : 0%;
right : 0%;
padding :5px;
}

the li css

.sidemenu li{
list-style: none;
padding: 10px 10px;
margin: auto;
color: white;
width : 100%;
display:inline-block;
position: relative;
}

the ul css

#service_categories{
width: 100%;
position: absolute;
}

thanks!

Upvotes: 0

Views: 391

Answers (1)

BBQ.
BBQ.

Reputation: 170

List elements always come with some padding. Make sure to remove that and your LI element will get its 100% width.

ul{
    padding:0;
}

http://jsfiddle.net/10b7crok/

Upvotes: 3

Related Questions