[CSS] Wrapper tut nicht das was er soll

Dieses Thema im Forum "Webdesign" wurde erstellt von ChrIzZ1337, 27. Januar 2012 .

Schlagworte:
  1. 27. Januar 2012
    Wrapper tut nicht das was er soll

    Hey Leute,
    ich habe ein Projekt für die Uni am laufen bzw. eine Website, die benotet wird.

    Das ganze soll in php ablaufen und ich bin momentan im klinsch mit dem Stylen der Seite mit CSS.

    Ich gebe euch mal den code der index.php
    Code:
    <html>
    <?php
    ## Website programmiert in php
    ## Version 1.0
    ## ChrIzZ1337
    ## Dozent: xxx
    ## FH xxxx
    ## 2012
    
    ## Ausschalten der "harmlosen" Notice-Reports, wenn eine Variable nicht deklariert ist.
    
     error_reporting(E_ALL ^ E_NOTICE);
     htmlentities($str, ENT_QUOTES,'UTF-8');
    
    ## Metadaten und Kopfdaten includen
    
     include("include/head.inc.php");
    
    ## Deklaration der Variablen
    
     $page = $_GET['page'];
     
    ?>
     <div id="out">
     <div id="banner">
     </div>
     <? include("include/nav.inc.php"); ?>
     <? include ("include/content.inc.php") ?> 
     <? include ("include/foot.inc.php") ?> 
     </div>
     
     </body>
    </html>
    
    Und der CSS-Datei:
    Code:
    html, body {
     text-align:center;
     margin:0;
     padding:0;
     background-image:url(BG.jpg);
     font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
    }
    #out {
     width: 1000;
     margin: auto;
     
     
     
    }
    #navi {
     width: 100;
     height: 730;
     float:left;
     background-image:url(background.png);
     font-size:9;
     color:white;
     
    }
    #contentOut {
     width: 800;
     margin: auto;
     float: left;
     padding-top:50;
     padding-left: 50;
     
    
    }
    #contentTop {
     font-weight:400;
     color:white;
     font-size:36; 
     width:700;
     height:30;
     text-align:left;
     
    
    }
    #contentMain {
     width:800;
     margin-top:30;
     margin-right: 30;
     color: white;
     font-size: 16;
     float:left;
     
    }
    #banner {
     width: 855;
     height: 150;
     background-image:url(Fast2.jpg);
     float:right;
    }
    #foot {
     width: 500;
     height:10;
     color:white;
     font-size:10px;
     border: 1px solid red;
     margin: auto;
     padding-top:300;
     
    }
     
     
    //Klassen 
    }
    .navi {
     width:100;
     height: 182,5;
     text-align: center;
     margin:5;
     margin-top:15;
     font-size:5;
    }
    
    //.current Klasse macht irgendetwas, wenn man sich "gerade" auf dieser Seite befindet.
    .current{
     border: 1px solid red;
    }

    Nun ist mein größtes Problem, dass ich ja #out als Wrapperklasse habe und diese Klasse im Prinzip alles vereint. Leider ist dem nicht so =( Wenn man dem #out border:1px solid red; gibt, dann wird nur ein dünner rahmen ohne Inhalt angezeigt am oberen Bildrand.

    nächstes Problem ist, dass ich den #foot nicht anständig unter dem #contentMain fenster ist ... ich hoffe ihr könnt mir helfen! Danke im Voraus

    Chris
     
  2. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    kannst nich die ganze website hochladen bzw link geben wenn se schon iwo zum testen auf nem server hast...mit der index allein ohne inhalte schwer zu sagen was nich geht bzw kann mans nich testen...
     
  3. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    http://92.77.64.114/Pruefung/

    hab keinen eigenen apache server, deshalb tuts xampp auf meinem PC


    soll ich die einzelnen div-container einfärben?
     
  4. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    hehe ok ... schaus mir nachher an ... muss jetzt training ... so um 10 wenn dann noch on wärst wär gut bzw dein pc an das ich drauf kann ;-) ... kannst mir aber auch die ganze hp gezippt schicken dann lad ich se bei mir aufn server ma hoch ...
     
  5. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    bin bis 10 on, danke dass du mir hilfst ich krieg da ne note drauf, deshalb is das wichtig
     
  6. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    clear:both wirkt wunder

    einfach vor das schließende </div> von #out einfügen:
    HTML:
    <div style="clear:both"></div>
    is so auf die schnelle der einfachste weg
     
  7. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    ich versuche es mal danke
    yess! das funkt!!! <3 dich

    kannst du mir noch erklären, wieso das so ist?
     
  8. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    nö, weil es schon zick mal im www duchgekaut wurde

    erstes ergebnis von google:
    float und clear | Webdesign mit (X)HTML und CSS
     
  9. 27. Januar 2012
    AW: Wrapper tut nicht das was er soll

    danke danke danke jetzt kann ich bedenkenlos die restlichen funktionalitäten einbauen danke

    kannste trotzdem bitte offen lassen, weil ich glaube es bahnt sich schon eine neue Frage an aber die ist noch nicht soweit, dass ich sie besprechen muss
     
  10. 28. Januar 2012
    AW: Wrapper tut nicht das was er soll

    Hi,

    HTML:
    <div style="clear:both"></div>
    ist relativ veraltet und fügt zusätzlichen Code hinzu.
    Eleganter kannst Du es mit:

    HTML:
    overflow:auto;
    oder
    HTML:
    overflow:hidden;
    in deinem Selektor #out lösen.

    VG
     
  11. 28. Januar 2012
    AW: Wrapper tut nicht das was er soll

    danke das ist cool , jetzt hab ich aber noch größere Probleme siehe webentwicklung ...
     
  12. 30. Januar 2012
    AW: Wrapper tut nicht das was er soll

    Keine Ursache, meld Dich einfach wenn Du Unterstützung brauchst ;-)
     
  13. 15. Februar 2012
    AW: Wrapper tut nicht das was er soll

    Was soll daran veraltet sein?
    es ist nur eine andere Möglichkeit. Jedoch wird hier overflow mMn missbraucht, da overflow dafür zuständig ist, wie der Browser übergroße Elemente darstellen soll und dann gegebenenfalls diese abschneidet.
    Ist also bei sowas nur mit Vorsicht zu genießen.

    Dann schon eher die EasyClearfix-Methode
    14.9 Methode 4: Easy Clearing — die Sache mit dem Punkt - Little Boxes - Webseiten gestalten mit HTML und CSS (Peter Müller)
     
  14. 15. Februar 2012
    AW: Wrapper tut nicht das was er soll

    und was genau ist an deinem hack nun besser?
    sorry muss grad ein wenig schmunzeln

    clear:etc via markup ist die wohl einzige saubere methode, alles andere sind hacks.
    clearfix ist sogar noch um einiges übler als overflow - jeder wie er will ^^

    ich will damit nicht sagen, dass markup DIE BESTE methode ist, nein, je weniger markup desto besser, aber es ist wohl die weniger fehleranfällige und genügsamere methode.
     
  15. 15. Februar 2012
    AW: Wrapper tut nicht das was er soll

    Hm, was besser ist, kommt wahrscheinlich immer auf den Einsatz und persönlichem empfinden an.
    Ich hab nur gemeint, das ich die Methode persönlich besser finde, als Overflow zu nutzen.

    Selber benutzt ich klassisch auch <div style="clear:both">
     
  16. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.