Ankündigung

Einklappen
Keine Ankündigung bisher.

HTML/CSS Problem mit floating und 100%

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • #16
    Ich habe es jetzt gelöst bekommen
    Die Lösung heißt min-width

    Code:
    <html lang="en">
    
        <head>
            <meta charset="utf-8" />
            <title>New</title>
            <style type="text/css">
    
                .logo {
                    float: left;
                    width: 260px;
                    height: 50px;
                    background: green;
                }
    
                .nav-main {
                    background: red;
    				min-width:500px;
                }
    
                .nav-sub {
                    background: blue;
    				min-width:500px;
                }
    
            </style>
        </head>
    
        <body>
            <div class="header">
                <div class="logo">
                    .logo
                </div>
                <div class="nav-main">
                    .nav-main
                </div>
                <div class="nav-sub">
                    .nav-sub
                </div>
            </div>
    
        </body>
    
    </html>
    Vielen Dank für eure Hilfe

    Kommentar


    • #17
      min-width ist in älteren browsern noch nicht definiert. ie 6 und 7 dürften dir da probleme bereiten

      Kommentar


      • #18
        Zitat von MikO Beitrag anzeigen
        min-width ist in älteren browsern noch nicht definiert. ie 6 und 7 dürften dir da probleme bereiten
        Der 7er geht... Nur bei dem 6er musst Du mit Javascript dynamisch auf die CSS-Eigenschaft zugreifen. Dazu: http://jeenaparadies.net/weblog/2007...dth-expression

        Liebe Grüße

        Kommentar


        • #19
          Oft reicht auch, über einen Hack für den IE eine feste Breite/Höhe zu vergeben. Der IE drückt bei größeren Imhalt dann das Element auf.
          --

          „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
          Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“


          --

          Kommentar


          • #20
            Keine Ahnung, ob ich das richtig interpretiere, aber:

            tr0ys Lösung ist da robuster.
            HTML-Code:
            <!DOCTYPE html>
            
            <html lang="en">
            
                <head>
                    <meta charset="utf-8" />
                    <title>New</title>
                    <style type="text/css">
            
                        .logo {
                            float: left;
                            width: 260px;
                            height: 50px;
                            background: green;
                        }
            
                        .nav-main {
                            background: red;
                            height: 80px;
            		margin-left: 260px;
                        }
            
                        .nav-sub {
                            background: blue;
                            height: 80px;
            		margin-left: 260px;
                        }
            
                    </style>
                </head>
            
                <body>
                    <div class="header">
                        <div class="logo">
                            .logo
                        </div>
                        <div class="nav-main">
                            .nav-main
                        </div>
                        <div class="nav-sub">
                            .nav-sub
                        </div>
                    </div>
            
                </body>
            
            </html>
            PHP-Wissenssammlung Composer Awesome Awesomeness PHP: The Right Way @mermshaus

            Kommentar

            Lädt...
            X