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;
}
I have a CSS problem and I can not solve it. So I ask of you.
Look at the screen
You must be registered for see links
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;
}