FB share tekst verticaal centreren

Status
Niet open voor verdere reacties.

Pieterpluk

Gebruiker
Lid geworden
17 jan 2013
Berichten
19
Beste Helpmij van mijn website wil ik de fb tekst recht bovenin horizontaal centreren. Ik heb het css element vertical-align:middle; geprobeerd maar dit helpt niet als ik deze toepas op mijn div class. Ook is de grote van de rechter div heel raar. Maar goed ik zal wel een leek in dit soort dingen zijn.

Mijn website: http://goo.gl/T4u9J8, zie rechts bovenin

:) Experts brand maar los! Alvast bedankt!
 
Je bedoeld de textvak waarin staat hoeveel mensen geliked hebben?
Ik zou het simpel doen en een nieuwe like button maken en dan kies je bij Layout: "button count" inplaats van "box count".
Je zou dan "Include share button" uit of aan kunnen vinken, wat jij wil.

Als het goed is staat het dan naast elkaar.
 
Je bedoeld de textvak waarin staat hoeveel mensen geliked hebben?
Ik zou het simpel doen en een nieuwe like button maken en dan kies je bij Layout: "button count" inplaats van "box count".
Je zou dan "Include share button" uit of aan kunnen vinken, wat jij wil.

Als het goed is staat het dan naast elkaar.

Sorry, ik bedoelde eigenlijk de tekst vind ons leuk en krijg 20% korting . Zodat deze tekst verticaal in het midden van de knop en de teller staat.
 
In dat geval weet ik niet zo een oplossing.
Snap ook niet helemaal 100% wat je precies bedoeld maar dat ligt aan mij;)
 
Naamloos.jpg

Witte tekst "aangewezen door de rode pijl" wil ik eigenlijk op de plek hebben waar nu het rode gebied is. Iets omhoog.
 
Aha:)

Je kunt die tekst in een span zetten en dan geef je die span dit mee:
Code:
position: relative;
bottom: 30px;
 
Hi.
Vertical-align op een element werkt als er een ander element naast staat. Het werkt niet als je dit in een container op 1 element toepast. In een container moeten dus minimaal 2 elementen staan. Hieronder een voorbeeld waarbij <p> zowel vertikaal als horizontaal is gecentreerd. Dit lukt door er een lege dummy <span> naast te zetten.
Code:
<div class="box">
<span></span><p>Eerste regel<br />en de tweede regel</p>
</div>

.box {
	width: 250px; /* er moet een breedte zijn voor text-align: center */
	height: 100px; /* er moet een hoogte zijn voor vertical-align: middle */
	text-align: center;
	background: #ff8000;
}

.box span {
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

.box p {
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	font: normal 100% sans-serif;
}
Er zijn andere manieren, bijvoorbeeld door table en table-cell in css te gebruiken, maar ik vermijd alles wat naar table ruikt :d
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan