I have a <ul>
just after the header in a section called:
<div class="entry-content" itemprop="text">
There seems to be a forced 40px left padding. How can this be removed? I thought that this would help:
ul.speakerclass {
padding: 0;
}
But no joy…
Here’s my CSS:
ul.speakerclass > li {
display: inline-block;
/* You can also add some margins here to make it look prettier */
width:180px;
zoom:1;
*display:inline;
/* this fix is needed for IE7- */
}
ul.speakerclass {
padding: 0;
}
.speakercard {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
max-width: 180px;
margin: auto;
text-align: center;
padding-top: 14px;
}
button.speakerclass {
border: none;
outline: 0;
display: inline-block;
padding: 10px;
color: white;
background-color: #393939;
text-align: center;
cursor: pointer;
width: 100%;
}
a.speakerclass {
text-decoration: none;
color: black;
}
button.speakerclass:hover, a:hover {
opacity: 0.7;
}
.speaker-box {
width: 100px;
height: 100px;
position: relative;
overflow: hidden;
border-radius: 50%;
border:1px solid #ccc;
margin-left: auto;
margin-right: auto;
}
.speaker-pic {
display: inline;
margin: 0 auto;
height: 100%;
width: auto;
}
I even tried the !important tag but still there seems to be padding….
Thanks!