Zentriert und gleichzeitig Linksbündig
knubbel
- html
Hallo,
ich habe früher Tabellen benutz um Texte oder Bilder zu zentrieren und suche dafür eine Alternative. Das Problem ist ich will die Sachen Zentriert und gleich zeitig Linksbündig.
Es ist mir egal ob es mit html oder css gelößt wird.
Wenn ich mit <p> zentriere wird es nicht so wie ich es haben will.
So will ich es haben:
-----------------------------
| |
| Hallo |
| go |
| blablablba |
| go |
| |
| |
| |
| |
-----------------------------
und das pssiert bei <p> oder <div>:
-----------------------------
| |
| Hallo |
| go |
| blablablba |
| go |
| |
| |
| |
| |
-----------------------------
Ich wills immer zentriert haben und gleich zeitig linksbündig, egal was für eine Auflösung der Sürfer hat.
Mfg
Hallo,
ich habe früher Tabellen benutz um Texte oder Bilder zu zentrieren und suche dafür eine Alternative. Das Problem ist ich will die Sachen Zentriert und gleich zeitig Linksbündig.
Es ist mir egal ob es mit html oder css gelößt wird.
am besten mit Beidem!
Klingt für mich nach:
<p style="padding-left: 50%">Dein Text</p>
oder wahlweise auch
<div style="padding-left: 50%">...</div>
Gruß Gunther
Hallo,
vielen Dank für die schnelle Antwort, wenn ich dass so mache bekomme ich so ein Ergebniss:
-----------------------------
| |
| Hallo |
| go |
| blablablba |
| go |
| |
| |
| |
| |
-----------------------------
Ich hätter es gerne so:
-----------------------------
| |
| Hallo |
| go |
| blablablba |
| go |
| |
| |
| |
| |
-----------------------------
Sicher könnte ich 20% nehmen, aber die Sürfer benutzen doch verschiedene Auflösungen.
Mfg
Hallo,
ich habe früher Tabellen benutz um Texte oder Bilder zu zentrieren und suche dafür eine Alternative. Das Problem ist ich will die Sachen Zentriert und gleich zeitig Linksbündig.
Es ist mir egal ob es mit html oder css gelößt wird.am besten mit Beidem!
Klingt für mich nach:
<p style="padding-left: 50%">Dein Text</p>oder wahlweise auch
<div style="padding-left: 50%">...</div>
Gruß Gunther
Hello out there!
[…] aber die Sürfer benutzen doch verschiedene Auflösungen.
Welche Auflösungen sie auch immer benutzen, sie haben für dich keinerlei Relevanz.
Bedenke bei der Gelegenheit, dass es problematisch ist, für Fließtexte feste Breiten vorzugeben; bei schmalem Viewport muss dann horizontal gescrollt werden, das ist nutzerfeindlich. 'max-width' ist die zu verwendende Eigenschaft, nicht 'width'.
Es ist mir egal ob es mit html oder css gelößt wird.
Das sollte es aber nicht. Für Darstellungsangaben ist CSS da, nicht HTML.
See ya up the road,
Gunnar
PS: Kein TOFU!
Hi,
Ich wills immer zentriert haben und gleich zeitig linksbündig, egal was für eine Auflösung der Sürfer hat.
Du könntest ein div machen, es zentrieren, und den Inhalt des div auf text-align:left; setzen.
Grüße,
Engin
GYRO
Hi,
wie wäre es damit ...
<html>
<head>
<title>lalala</title>
<style type="text/css">
body {
margin:0 0 0 0;
}
#container {
width: 100%;
border: 1px solid black;
text-align: center;
}
#inhalt {
width:300px;
border: 1px solid red;
text-align: left;
}
</style>
</head>
<body>
<div id="container">
<div id="inhalt">
test<br>
test<br>
test<br>
test
</div>
</div>
</body>
</html>
mfg
Knusperklumpen
Hello out there!
wie wäre es damit ...
Schlecht ...
#container {
text-align: center;
}
... denn 'text-align' wirkt nur auf Text (wär hätte’s gedacht bei der Bezeichnung) u.a. Inline-Inhalte, nicht jedoch auf Blockelemente. [CSS2 §16.1]
(Es hibt einen Browser, der das falsch interpretiert, aber der ist kein Maßstab.)
Wie’s richtig geht, steht in den FAQ, weil’s schon so viele gefragt haben. Jehova2!
See ya up the road,
Gunnar
Hallo Knubbel
Wenn ich mit <p> zentriere wird es nicht so wie ich es haben will.
So will ich es haben:
| |
| Hallo |
| go |
| blablablba |
| go |
| |
| |
| |
Wenn du dem Block eine feste Breite (oder besser Maximalbreite) geben kannst, dann ist es einfach.
CSS:
body {
text-align: center; /* damit es auch alte IEs begreifen */
}
.center {
text-align: left; /* der Inhalt soll links stehen */
margin: 0 auto; /* rechts und links automatisch einen gleich breiten Rand
oben und unten keinen Rand (0 oder wie von dir gewünscht */
width: 20em; /* besser wäre min-width was aber alte IEs nicht kennen */
~~~}
Das Blockelement welches zentriert werden soll muss dann die Klasse center (class="center") erhalten.
Wenn die Breite des Blocks nicht festgelegt werden kann sondern sich aus dem Inhalt ergeben muss, dann wird es etwas komplizierter.
Dieses [Beispiel](http://d-graff.de/demos/selfhtml/center-test.html) dürfte mindestens in IE6, aktuellen Geckos und Operas funktionieren.
Auf Wiederlesen
Detlef
--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!