Thema: [CSS] Auto height
-
01.10.2012, 10:22 #1
[CSS] Auto height
Hallo,
habe eine kleine Frage.
Ich habe eine Div die auf height 100% gesetzt ist. Somit bedeckt sie ja den ganzen Bildschirm(vertikal). Mein Problem ist, dass
wenn der Text über den Bildschirmrand hinausgeht, sich die Div nicht mitvergrößert.
Zum Verständniss:
HTML-Code:<html> <head> <title>Welcome</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div id="content"> Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden. </div> </body> </html>
Code:body { margin: 0; padding: 0; background: #242424; text-align: center; } #content { width: 750px; height: 100%; background: #FFFFFF; margin: 0 auto; border-left: 1px solid #999999; border-right: 1px solid #999999; font-size: 36px; }
Im Google habe ich eigentlich nicht wirklich was hilfreiches gefunden.
MfG
Moderator-Hinweis: Quellcode bitte zukünftig direkt im Thread mit dem code-Tag posten und nicht verlinken!
-
01.10.2012, 10:42 #2
-
01.10.2012, 10:44 #3
AW: [CSS] Auto height
Schau jetzt nochmal. Hab ein bisschen Text hinzugefügt.
Es geht mir einfach darum das die Div mit der height nicht "mitgeht".
Die height ist zwar auf 100% gestellt aber sobald sich der Text nicht
mehr ausgeht und man scrollen muss, verhaltet sich die Div, als hätte
sie eine fixe height zugewiesen bekommen.
-
01.10.2012, 11:09 #4
- Registriert seit
- 18.12.2011
- Beiträge
- 159
- Blog Entries
- 2
Thanked 182 Times in 98 PostsAW: [CSS] Auto height
Abgesehen davon, dass du über den Internet Explorer da in deinem Text herziehst muss ich zugeben, dass alles einwandfrei funktioniert im IE 9 (♥) und die DIV sich normal verhält. Vielleicht sagst du uns kurz, welcher Browser genau Probleme macht?
-
01.10.2012, 12:20 #5
AW: [CSS] Auto height
Firefox 4.0.1(bin in der Arbeit und habe keine Rechte die aktuelle Version zu laden xd), habe aber gerade bemerkt
das es im IE8 genauso funktioniert wie ich will.
Wahrscheinlich funktioniert es im aktuellen FF dann auch.
Ein Screen damit Ihr wisst was ich mein(t)e:
scr7b8e.JPG - IMG-UP.net
MfG
-
01.10.2012, 16:59 #6
- Registriert seit
- 15.11.2011
- Beiträge
- 6.210
- Blog Entries
- 5
Thanked 9.131 Times in 3.006 PostsAW: [CSS] Auto height
Eher andersrum: Der Internet Explorer interpretiert CSS mal wieder auf seine eigene Art und Weise (nämlich fernab von jeglichen Standards), daher funktioniert das ganze so in keinem anderen Browser außer dem IE.
Code:body { height:100%; ... } #content { min-height:100%; ... }
IE kp, ich persönlich optimiere auch keine Projekte mehr für den IE.
Das Ding hängt mit aktuellen Technologien hinterher bzw interpretiert sie eigenmächtig anders, hält sich nicht an festgelegte Standards etc, heißt du kannst deine Projekte erstmal für alle normalen Browser optimieren und dann nochmal extra für den IE.
Wobei das natürlich noch nicht reicht, beim IE gibts ja gleich mal mehrere Versionen mit unterschiedlichen Macken.
Die Tatsache, dass je nach Seite immer noch relativ viele User mit uralten Internet Explorer Versionen unterwegs sind macht das ganze natürlich noch lustiger.
In der aktuellen Version ist das ganze im Vergleich zu Früher ja etwas besser geworden, aber wenn aus einer astronomischen Katastrophe eine normale Katastrophe wird bleibt das ganze eben immer noch eine Katastrophe.
Zumal die Konkurrenz ja seit Jahren beweist, dass es eindeutig besser geht.
-
The Following 3 Users Say Thank You to DMW007 For This Useful Post:
-
01.10.2012, 18:58 #7
AW: [CSS] Auto height
Also das von DMW würde funktionieren, jedoch hast du da das Problem das du CSS sagst der body wäre nur 100% groß - was theoretisch richtig ist, wenn man die Box dann aber größer macht als sie wirklich ist, es zwar funktioniert, aber zu ein paar Problemen führen kann.
Die Lösung die du suchst heißt "overflow". Das ist ein Wert den du zuweisen kannst, wenn du eine höhe dem Parent-DIV zugewiesen hast, jedoch der Content an sich eben schon sichtbar größer wird. Wenn du overflow: auto; mit in dein #content reinpackst passt sich somit der DIV-Container nach der Höhe deinem Text an. Das funktioniert übrigens auch in einem Großteil der IE Versionen.
Hat also nicht nur den Vorteil das es eigentlich bei so gut wie allen Browsern funktioniert, sondern du auch keine anderen DIV's mit vielen Attributen beschmeißen musst die dir nachher eventuell genau diese Schwierigkeiten wieder bereiten.Geändert von Comu (01.10.2012 um 19:00 Uhr)
-
The Following User Says Thank You to Comu For This Useful Post:
exception (01.10.2012)
-
01.10.2012, 19:43 #8
- Registriert seit
- 18.12.2011
- Beiträge
- 159
- Blog Entries
- 2
Thanked 182 Times in 98 PostsAW: [CSS] Auto height
Ich verweise damit mal auf diese Seiten hier
New Internet Explorer Browser | Internet Explorer® 9
HTML5Labs - Home
-
03.10.2012, 09:04 #9
AW: [CSS] Auto height
Hallo,
erstmal danke für eure Antworten.
Die Eigenschaft min-height auf 100% bewirkt zwar das bei mehr Text die Div vergrößert wird, wenn jedoch zB. nur
ein Satz in der Div steht, verhält sich die Div als wäre sie auf 'height:auto' gestellt und macht deshalbt noch immer
nicht das was ich will.
Die Div soll immer 100% über den ganzen Bildschirm gehen(vertikal) und bei "mehr" Text automatisch vergrößert werden.
Bin schon die ganze Zeit am herumprobieren aber ich bekomm's einfach nicht hin.
MfG
Ähnliche Themen
-
Auto Logout
Von Luckyboy im Forum SupportAntworten: 4Letzter Beitrag: 19.03.2014, 11:16 -
Was ist das für ein orangenes Auto?
Von ThunderStorm im Forum Filme, Serien und TVAntworten: 2Letzter Beitrag: 28.05.2013, 06:21 -
Auto Lakierung
Von Glücks Engel im Forum FahrzeugeAntworten: 9Letzter Beitrag: 04.08.2012, 19:55 -
auto kauf
Von helfen im Forum RealLifeAntworten: 4Letzter Beitrag: 17.03.2012, 15:30
Diese Seite nutzt Cookies, um das Nutzererlebnis zu verbessern. Klicken Sie hier, um das Cookie-Tracking zu deaktivieren.