Afspeeltekst links centreren op button
Ik ben al een poos aan het puzzelen met van allerlei oplossingen maar het wil me maar niet lukken om het driehoekje verder naar links te plaatsen in het midden van de button.
Weet iemand een oplossing hoe dat kan?
zie: https://jsfiddle.net/3xq4g6u0/
Sietsko
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
.afspeelknop {
line-height:0.5em;
font-size: 3em;
}
.audiobutton1 {
padding: 0 3px 6px 5px;
}
line-height:0.5em;
font-size: 3em;
}
.audiobutton1 {
padding: 0 3px 6px 5px;
}
niet helemaal wat ik zoek want de width van de button is groter geworden.
Het is de bedoeling dat de button niet groter gaat worden en dat het driehoekje toch mooi gecentreerd is.
Sietsko
Hier is een werkend voorbeeld: https://jsfiddle.net/m37xhvya/
Heb het verwerkt en het werkt prima dus precies wat ik nodig heb.
Dankje voor het meedenken :)
Sietsko
Dat wordt keihard afgekeurd door een HTML-validator.
Dit is géén goede oplossing.
Ozzie PHP op 28/03/2017 17:07:06:
Met alle respect ... maar een paragraaf in een button is een NO GO!!!
Inderdaad. Is ook helemaal niet nodig.
Je kunt ook bij een fixed size je padding opgeven alleen moet je dan kiezen tussen links of rechts en tussen boven of beneden.
Toevoeging op 28/03/2017 18:38:30:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
.afspeelknop {
line-height:0.5em;
font-size: 3em;
}
.audiobutton1 {
height: 35px;
width: 35px;
padding-top: 0;
padding-left: 5px;
}
line-height:0.5em;
font-size: 3em;
}
.audiobutton1 {
height: 35px;
width: 35px;
padding-top: 0;
padding-left: 5px;
}
http://jsfiddle.net/JfGVE/1923/
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<button class="btn btn-afspelen"></button>
.btn-afspelen {
height: 35px;
width: 35px;
text-align: center;
}
.btn-afspelen::before {
font-family: 'FontAwesome';
content:"\f04b";
}
.btn-afspelen {
height: 35px;
width: 35px;
text-align: center;
}
.btn-afspelen::before {
font-family: 'FontAwesome';
content:"\f04b";
}
Gewijzigd op 29/03/2017 20:19:37 door Mr Beronne