Ich versuche, 2 Bilder und etwas Text auszurichten. Ich möchte dazu keine Tabelle verwenden.Ausrichten von 3 Bildern in HTML und CSS ohne Tabelle
Gibt es eine Möglichkeit, dies mit Inline-Styling zu tun? Ich möchte, dass sie alle gleichmäßig verteilt sind.
IMG 1> TEXT> IMG 2
Hoffnung macht das Sinn
Sie können dies tun, mit Flexbox:
HTML
<div>
<img />
<p>text</p>
<img />
</div>
CSS
div {
display: flex;
justify-content: center;
}
Weitere Informationen: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
diese Methode funktioniert, aber jetzt ist meine h1-Tag (der Text) nicht vertikal ausgerichtet. Es ist in Richtung der Spitze des Div, gibt es eine Möglichkeit, ich kann es vertikal zentrieren? – LukeTerzich
Versuchen Sie 'align-items: flex-start | Flex-Ende | Zentrum | Grundlinie | strecken; '- Einer von denen sollte funktionieren. Es sollte im Div-Selektor sein. –
danke funktionierte perfekt mit align-items: center – LukeTerzich
die Sie interessieren,
Aktualisiert
div {
text-align: justify;
display:table;
}
span{
display:table-cell;
vertical-align:middle;
padding:0 60px;
}<div>
<img src="http://www.raisedeyebrow.com/sites/www.raisedeyebrow.com/files/blog/2012/01/fff.png" alt="" />
<span>Text Here</span>
<img src="http://www.raisedeyebrow.com/sites/www.raisedeyebrow.com/files/blog/2012/01/fff.png" alt="" />
</div>Ich möchte nicht, dass sich jedes div ändert, wie wähle ich das div aus fraglich? – LukeTerzich
Ich habe die Antwort aktualisiert, überprüfen Sie, ob Sie das suchen! –
Fragen Code Hilfe suchen müssen den kürzesten Code enthalten notwendig, es zu reproduzieren ** in der Frage selbst ** vorzugsweise in einem [** Stack Snippet **] (https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/). Siehe [** So erstellen Sie ein minimales, vollständiges und überprüfbares Beispiel **] (http://stackoverflow.com/help/mcve) –