css - Center List in side a div -
i'm trying center list images inside div. i'm getting (icons way small , not centered).
this css ive got , html
<div id="social"> <ul> <li><img src="img/footertwitter.png" alt="placeholder+image"></li> <li><img src="img/footerfacebook.png" alt="placeholder+image"></li> <li><img src="img/footeremail.png" alt="placeholder+image"></li> </ul> </div> #social { margin: 0 auto; text-align: center; width: 90%; max-width: 1140px; position: relative; } #social ul { /*margin: 0 0 3em 0!important;*/ padding: 0!important; } #social ul li { list-style-type: none; display: inline-block; margin-left: 1.5em; margin-right: 1.5em; }
in rule ul
consider setting display property block , margins auto. if understand correctly you're trying accomplish, should center things while retaining margins assigned.
the updated css like:
#social { margin: 0 auto; text-align: center; width: 90%; max-width: 1140px; position: relative; } #social ul { padding: 0; margin:auto; display: block; } #social ul li { list-style-type: none; display: inline-block; margin-left: 1.5em; margin-right: 1.5em; }
this fiddle shows changes in action. hope helps.
Comments
Post a Comment