warum nicht diese css-button-center in div?
So... das fängt an, mich zu ärgern ... und ich dachte, ich würde hierher kommen und bekommen einige helfen..
Dem Haupt-div die box hat eine Breite... dann ist es text... und einem button, ich möchte in der Mitte des div..
es ist ein <a href>
Taste.. aber es wird nicht center.
Ich nicht denken, ich würde angeben müssen, eine Breite, da die außerhalb des div hat eine Breite.. ich habe versucht margin:0 auto; text-align:center
etc nichts funktioniert
<h2 class="service-style color_service">Annoyed</h2>
<div class="service-text text1">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Lorem ipsum dolor sit amet…
</p>
<a href="" class="button button-large"><i class="fa fa-credit-card" style="padding-right:10px;"></i> Learn More</a>
</div>
hier ist der fiddle-link
- Anmerkung: die Im IE9 scheint es viel mehr kaputt als nur die Taste.
- Einfachste Möglichkeit wäre, wickeln Sie es in einem anderen div aber dieser code, den Sie haben, ist uhhh 🙂 ich vermute, dass Sie Anfänger sind, so halten Sie die Arbeit für Sie besser wird 🙂
Du musst angemeldet sein, um einen Kommentar abzugeben.
Haben Sie das problem, weil dersiehe hier
display:inline-block
...In diesem Abschnitt csshinzufügen:
Entfernen Sie alle
margin
's set beibutton
Klasse und ergänzen wie folgt:EDIT : inline-block, ohne Setzung einer Breite
inline-block-demo
, Wie zu tun einzige Lösung für center-inline-block-element ist zu verwenden
text-align:center
in der css-Klasse:
- und dann hinzufügen:
diese Weise werden Sie nicht brauchen, zu geben
width
und nurpadding
würde Ihr problem lösen!inline-block
..bitte sehenheight
fehlte für diedocument
!!Schaltfläche muss ein block-level element. Einfachste Lösung:
http://jsfiddle.net/jqvbM/
Würde ich auch löschen, die 10px rechten Rand auf
a.button-large i
um den Mittelpunkt der "Mehr" text.Müssen Sie das text-align:center; für das Eltern-element der Schaltfläche in Ihrem Fall ist das div.service-text.
wenn Sie möchten, dass die Spitze P text-align:right; bitte verwenden Sie diffrent P auf die Schaltfläche
erinnern. wenn Ihr element display:block; so müssen Sie margin: 0 auto; Ihrem element. wenn Ihr element display:inline-block; Sie brauchen, um text-align:center; für das Eltern-element.
überprüfen Sie hantieren hier
müssen Sie ändern Sie Ihre css wie unten:
- entfernen
margin
ausa.button-large
Klasse- und change -
display:table
im.button
KlasseSchnelle Möglichkeit ist das hinzufügen von
"text-align: center;"
zu.service-text
.Ich würde vorschlagen, wählen Sie zurück ein wenig und die Scheidung sich vom Rahmen oder was auch immer Sie verwenden. Zu center Dinge, horizontal gibt es 2 Ansätze.
Müssen Sie entscheiden, ob Sie möchten, dass die Schaltfläche position: inline, inline-block, oder block. Für mobile und Fingern und all das Zeug(2014) - ich würde vorschlagen, inline-block oder-block. So
wenn es inline-block, dann können Sie genauso zu behandeln wie text. Legen Sie den übergeordneten zu
text-align center;
Wenn es blockiert, dann können Sie
margin-right: auto; margin-left: auto;
aber das hat andere Probleme. Wie alle anderen denkt, dass es in der Nähe organisiert werden müssen richtig so, dass Sie nicht schweben alle über einander und Schraube alles um. Ich würde vorschlagen, Sie tun es so: jsfiddlePS - wir brauchen nicht zu sehen, so viel code in Ihre Geige. Es ist leichter zu bekommen, um die Niederlage der problem mit, nur das Nötigste. Viel Glück.
HTML
CSS
Versuchen, Ihre Schaltfläche in einem div und update
CSS
wie unten angegebenVersuchen, diese
DEMO
Wickeln Sie die Taste in einem element, und geben Sie es
text-align:center
.Schreiben:
Aktualisiert Geige hier.