Help a little CSS problem?

Status
Not open for further replies.

Stormy

Member
Apr 11, 2013
69
11
Hey guys,

I have a CSS problem and I can not solve it. So I ask of you.
Look at the screen


As you can see, you see between the twitter icons dashes.
How can I fix this?
As you can see, you see between the twitter icons dashes.
How can I fix this?

This is my html and css:

<div class="teambox">
<div class="photo">
<img src="template/img/profilepicture.png" alt="Selena Gomez">
</div>
<div id="team-name">Sjon</div>
<div id="person-position">App-Developer</div>
<div id="bio">
<t>Ik ben Sjon, <br /> ik ontwikkel Android apps met <br /> een moderne UI (user interface) helemaal van deze tijd en het belangrijkste, 100% kwaliteijd.</t>
</div>
<div id="socialmedia-list">
<div id="socialmedia-icons">
<a href="#" class="twitterx">
<img src="template/img/twittericon.png" alt="Twitter">
</a>

<a href="#" class="fbx">
<img src="template/img/twittericon.png" alt="Twitter">
</a>

<a href="#" class="inx">
<img src="template/img/twittericon.png" alt="Twitter">
</a>
</div>
</div>

.teambox {
width: 362px;
height: auto;
float: left;
background-color: #34495e;
margin: 20px 2px;
}

#team-name {
padding: 10px;
text-align: center;
color: #fff;
font-size: 22px;
font-weight: normal;
font-family: 'Chewy';
}

#person-position {
padding: 10px;
text-align: center;
color: #fff;
font-size: 14px;
margin-top: -10px;
font-weight: bold;
font-family: 'Arial';
}

#bio {
color: #fff;
text-align: center;
margin-top: 10px;
margin-top: 10px;
padding: 10px;

}

#socialmedia-list {
width: 100%;
height: auto;
background-color: #fff;
padding: 0px 0px;
border-top: 2px solid #2c3e50;
float: left;
}

#socialmedia-icons {
padding: 10px;
margin: auto 60px;
background-color: red;
width: 100%;
}

#twitter {
width: 54px;
height: 50px;
}

.twitterx {
padding: 10px;
}

.fbx {
padding: 10px;
}

.inx {
padding: 10px;
}

#iconhover {
margin-top: 10px;
}
 
Status
Not open for further replies.

Users who are viewing this thread

Top