I have a ul
list with background image
ul {
margin: 0;
padding: 0;
list-style: none;
background: url("../images/columns_sep_thumbs.png") repeat-y 50% 0;
}
With the following style for li
li {
float: left;
width: 220px;
margin: 0;
padding: 20px 15px;
list-style: none;
text-align: center;
}
the image disappears when li items float left, any suggestions?
<ul>
<li>
content1
</li>
<li>
content2
</li>
<li>
content3
</li>
</ul>
Add clearfix pseudo element to the ul
ul:after {
content: "";
clear: both;
display: table;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.