|
|||
Vertical-align
Heyh Leute ich habe ein sehr kleines Problem und es kann auch sein das es an meinem Browser liegt aber wie zentriert man einen Text nochmal vertical?
Das geht doch eig so: HTML-Code:
<p style="vertical-align:center">Mitte</p> Es passiert einfach nichts Könnt ihr mir helfen? MFG Daniel |
Sponsored Links |
|
|||
Hallo,
vertikales Zentrieren ist für die Informationsübertragung nicht erforderlich. Deshalb bestimmt im Regelfall der Inhalt die Höhe von Elementen. Deshalb war bis CSS 2.1 vertikales Zentrieren nur in a) Tabellen (table-Element) und b) in der Tabellenansicht (display: table) möglich. Mit CSS3 ist zusätzlich noch als Drittes das Flexbox-Modell hinzugekommen. Gruss MrMurphy |
Sponsored Links |
|
|||
Hallo
Zitat:
a) Grundlagen und b) Probleme eingegangen. Es werden mehr oder weniger nur Standardlösungen präsentiert, die mit der Realität recht wenig zu tun haben. Zudem wurde Flexbox mehrfach grundsätzlich überarbeitet und das das Web nie vergisst kursieren auch noch Anleitungen zu den veralteten Lösungen. Du kannst dir ja mal folgende Infos anschauen: CSS3 Flexbox Tipps Tutorial Anleitung Das Modell der flexiblen Boxen Einführung in das Flexbox-Modell von CSS | kulturbanause® blog https://css-tricks.com/snippets/css/a-guide-to-flexbox/ oder folgendes Video mit seinen Nachfolgenden https://www.youtube.com/watch?v=xyLa8LNIKjg oder folgende englischsprachige Videos https://www.youtube.com/watch?v=RSriXZSt0-c https://www.youtube.com/watch?v=D-cWTumhSEU Gruss MrMurphy |
|
|||
Das mit dem Inline Block funktioniert auch nicht!:/
Ich zeige euch mal den ganzen Code: HTML-Code:
<html> <head> <title>Daniel</title> <style> html, body { margin:0; padding:0; } header { position: relative; height:100%; min-height:100%; width: 100%; background: url(./img/start.jpg) no-repeat top center; background-size: cover !important; -webkit-background-size: cover !important; text-align: center; overflow: hidden; } a.scrollstart{ border-color:red; width:30px; height:30px; } a{text-decoration:none;} </style> </head> <body> <header>Welcome<br/> <div><a href="#second" class="scrollstart">^^</a></div> <p style="display: inline-block; vertical-align: middle">Mitte</p> </header> <section id="second"> <p>hey</p> </section> </body> </html> |
|
|||
Hallo,
deinen Angaben ist leider nicht zu entnehmen was wie vertikal zentriert werden soll. Mit deinem Qelltext erscheint mehr oder weniger nur eine fast leere Seite. Die hilft auch nicht weiter. Und wie soll sich die Seite verhalten wenn mehr Inhalt hinzukommt? Oder die Besucher kleinere Fenster als du haben? Insgesamt denke ich das du leider etwas unrealistische Vorstellungen von den Möglichkeiten von HTML und CSS hast, so das es für deine Vorstellung keine Lösung gibt. Gruss MrMurphy |
|
|||
Zitat:
Wenn die Leute einen anderen Bildschirm haben, arbeite ich noch mit Media Query's Also ihc mach die Seite noch responsive Ich möchte das ein Satz in der Mitte des Bildschirm steht quasie mitte mitte Das was ich da gerade stehen habe ist einfach nur so... |
|
|||
|
Sponsored Links |
|
|||
Reintheoretisch könnte man das auch mit:
Code:
#dieKlasse{ top:50%; left:50%; } |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
vertical geteiltes Design | emmis | CSS | 7 | 24.11.2009 09:42 |
<DT>1. align links, 2. align rechts</DT> | amasingh | CSS | 7 | 27.10.2009 10:21 |
vertical textausrichtung | Holger (HMR) | CSS | 1 | 10.06.2008 14:08 |
Verical align bei Divs geht nicht | cross_site_script | CSS | 4 | 04.06.2007 07:33 |
Vertical Align im DIV Tag (FLOAT) | Tino Schneider | CSS | 2 | 29.09.2004 13:31 |