mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 00:35 Benutzername: Passwort: Auto-Login

Thema: Div-Element erzeugt kein Zeilenumbruch vom 06.09.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Div-Element erzeugt kein Zeilenumbruch
Autor Nachricht
bbcsb
Threadersteller

Dabei seit: 09.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 06.09.2009 21:44
Titel

Div-Element erzeugt kein Zeilenumbruch

Antworten mit Zitat Zum Seitenanfang

Hallo zusammen,

ich habe ein kleines Problem und zwar dachte ich immer, dass Block-Elemente wie z.B. div´s einen automatischen Zeilenumbruch erzeugen... In meinem Beispiel erzeugt das div mit der Klasse "content_l" leider keinen Umrbuch und ich habe keine Ahnung wieso *Schnief*

Hier das HTML der Seite:
Code:

<div class="site">
   <div class="header"><span class="guildname">Deine Gilde</span></div>
    <div>
       <div style="width:206px;float:left">
           <img src="img/nav_top.png" style="width:206px;height:38px;padding-left:18px" />
            <div class="nav_element">
               <div id="menu_1" class="nav_top" style="background-image:url(img/nav_open.jpg);" onclick="menu(1)">Menüpunkt</div>
                <ul id="nav_1" class="nav_child1" style="display:block">
                   <li class="icon">Punkt 2</li>
                    <ul class="nav_child2">
                        <li>Hallo</li>
                        <li>Hallo</li>                                                               
                    </ul>                   
                </ul>
            </div>
            <img src="img/nav_bottom.gif" style="width:190px;height:15px;padding-left:34px" />
        </div>
        <div style="margin-left:224px;width:929px">
           <div class="content_top"></div>
           <div style="background:url(img/conent_back.gif)">
               <div class="content_l">          askjdhadjsjasdasasasadasdsdadasdwqdqadqwdwdwdqdqdyxcadsaddsasdasdasdadasdasdasdasdsadasadaaaaaaaaaaaaaaaaaaaadddddddddddd
                </div>
                <div class="content_r">
                    askjdhadjsjasd
                </div>                                                                                                               
            </div>
           <div class="content_footer"></div>                       
        </div>
    </div>
</div>



Das CSS:
Code:
body {background-color:#1b0000;padding:0;margin:0;font-family:Verdana, Arial, Helvetica, sans-serif}

div.site {padding:auto;margin:auto;width:1233px;}
div.header {background-image:url(img/header.png);background-repeat:no-repeat;width:1233px;height:369px}
div.nav_element {background-image:url(img/nav_back.png);background-repeat:repeat-y;width:190px;margin-left:34px;float:left}
div.nav_top {width:163px;height:26px;font-size:13px;font-weight:bold;color:#d09f28;margin-left:12px;background-repeat:no-repeat;padding-left:34px;padding-top:4px;cursor:pointer}
ul.nav_child1 {color:white;font-size:12px;list-style-type:none;padding-left:37px;}
ul.nav_child2 {list-style-type: square}
span.guildname {font-size:22px;text-align:center;color:#dbbc85;font-weight:bold;padding-top:94px;display:block}
div.content_top {background:url(img/conent_top.gif) no-repeat;height:43px}
div.content_footer {background:url(img/conent_footer.gif) no-repeat;height:75px}
div.content_l {padding-left:58px;border:2px solid green;float:left;width:580px;margin-right:54px; white-space:nowrap}
div.content_r {}


Das Ganze sieht dann so aus wie auf dem Beispielbild...




Vielen Dank schonmal für eure Hilfe Lächel


Zuletzt bearbeitet von bbcsb am So 06.09.2009 21:48, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst So 06.09.2009 21:58
Titel

Antworten mit Zitat Zum Seitenanfang

Wenn Du damit meinst, dass das lange Wort nicht auseinandergerissen wird - das ist normal *zwinker* Kein Browser macht das, denn ohne Leerzeichen auch kein Umbruch. Es sei denn Du verwendest die von MS erfundene (später allerdings auch in CSS 3 aufgenommene) Eigenschaft word-wrap mit dem Wert break-word. Außer dem IE kann das inzwischen z.B. auch FX ab 3.5.

Dennoch: Das div selber erzeugt natürlich einen Zeilenumbruch, d.h. per default wird es immer in einer neuen Zeile stehen. Das hat aber nichts damit zu tun, wie es mit seinem Inhalt umgeht. Elemente, die ihren Inhalt auch ohne white-space trennen, gibt es nicht (das ist nur mit besagter CSS-Eigenschaft möglich).

Übrigens ist Dein white-space: nowrap; in diesem Zusammenhang als äußerst kontraproduktiv zu bezeichnen, denn damit gibt es einen Umbruch noch nicht einmal mehr bei Leerzeichen *zwinker*


Zuletzt bearbeitet von heiko_rs am So 06.09.2009 22:02, insgesamt 3-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
bbcsb
Threadersteller

Dabei seit: 09.03.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 06.09.2009 22:25
Titel

Antworten mit Zitat Zum Seitenanfang

Wupsalla... ich sahs wohl heute zu lange davor, sowas dummes zu übersehen ist schon peinlich ^^ Das nowrap stammt noch aus einem anderen Versuch... Danke für die Hilfe Lächel
  View user's profile Private Nachricht senden
 
Ähnliche Themen über css ein Element nach definiertem Element ansprechen
[PHP] Kontaktformular erzeugt nur Fehlermeldung
Umlautdomain und Flash erzeugt Fehler
Wie erzeugt man solche schönen effekte?
[JavaScript] Erzeugt Fehler im Firefox
[Freehand MX] Exportieren erzeugt Fehlermeldung
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.