kostenloser Webspace werbefrei: lima-city


bekomme CSS-Design nicht hin

lima-cityForumDie eigene HomepageGrafikdesign

  1. Autor dieses Themas

    m*4

    Ich probiere schon den ganzen Abend so ein Standart CSS-Desing hinzubekommen bei dem der Inhalt der Seite mit einem flxieblen grafischen Rahmen umgeben ist.

    Das ist sind die Divs:

    <div id=\"main\">
      <div id=\"top\">
        <div id=\"left\"></div>
        <div id=\"right\"></div>
      </div>
      <div id=\"middle\">
        <div id=\"left\"></div>
    
        <div id=\"content\">
        </div>
    
        <div id=\"right\"></div>
      </div>
      <div id=\"bottom\">
        <div id=\"left\"></div>
        <div id=\"right\"></div>
      </div>
    </div>


    Ich bekomme es einfach nicht hin. Kennt jemand ein Tutorial dazu?
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. was genau bezweckst du - welches der div-tags soll den rahmen bilden, bisher hast du kein einziges wort in css darin
  4. Autor dieses Themas

    m*4

    Ich hab vor lauter ärger die CSS-Datei gelöscht, deshalb muss ich \'s jetzt erklären.

    Also der Main-Div beschränkt das ganze auf irgendeine Breite. Dann der gibt es drei Zeilen. Top, Middle und Bottom. Top und Bottom sind die Ränder oben und unten. D.h. Top bekommt die ober Linie als Hintergrund und die darin enthaltenen Left und Right sind dann die Ecken u.s.w.. Aber irgendwie hat das alles nicht funktioniert. Zwar kriege ich den Rahmen komplett gezeichnet, aber es ist nicht richtig flexiebel, wenn der Text z.B. länger wird.
  5. hast es schon mal irgendwo auf den webspace geladen?
    du solltest sowohl für die bereiche oben, mitte und unten 3 spalten haben und zwar links mitte rechts
    so kannst du die runden ecken machen mit fester breite und höhe der eck-div-tags
    die mittleren spalten oben und unten haben dann einen sich wiederholenden hintergrund in x- richtung (repeat:repeat-x) => flexibel
    die linke und rechte spalte der mittleren zeile bekommt auch so einen hintergrund aber in y-richtung => flexibel
  6. Das Stichword ist mal wieder \"min-height\".
    Wenn du nur \"height\" setzt, ist die Höhe absolut.

    Min-height ist einfach nur die _minimale_ Höhe, kann also trotzdem noch größer werden.

    Ansonsten sehe ich da nicht wirklich ein Problem(bis auf die Sache mit den Rändern, dich ich nicht ganz verstehe)
  7. Anscheinend weißt du nicht genau, was CSS eigentlich ist oder du hast einfach den CSS Code zu posten vergessen.
    Abgesehen davon ist der HTML-Code Ausschnitt eine Katastrophe:
    11 <div> Tags, aber nur 5 </div> Tags, nicht ein bisschen komisch? ;)

    Außerdem musst du nicht lauter solche Links, Rechts, Oben, Unten usw. Rahmen erstellen.
    Du musst lediglich eine Klasse für den Inhalt (Kann man gleich die body-Klasse verwenden) und eine für den Rahmen erstellen, oder du kombinierst beide in einer Klasse, hat aber Nachteile.

    CSS-Technisch müsste es in etwa so lauten:

    body  {
      background-color: #FFFFFF;
      color: #000000;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 12px;
      width: 500px;
      overflow: auto;
      min-height: 20px;
    }
    
    div#Rahmen  {
      border: 1px solid black;
      background-color: #FFFFFF;
      color: #000000;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 12px;
      width: 500px;
      overflow: auto;
      min-height: 20px;
    }


    Der HTML-Ausschnitt müsste in etwa so lauten: (gehört übrigens zwischen <body> und </body>)

    <div id=\"Rahmen\">
    Dein gewünschter Text
    </div>


    Der oben genannte Code ist nur ein Ausschnitt, den du in deine HTML Seite einfügen solltest, bitte nicht den Code als einzelne Seite ohne <head>, <title>, <body>, <html> usw. Angabe verwenden.

    So einfach geht das alles.


    LG,
    Hellf1ghter

    EDIT: Hmmm, anscheinend habe ich zu früh auf \"Antworten\" geklickt.. Jetzt verstehe ich erst genau, was du brauchst..

    Beitrag geändert: 13.5.2008 22:13:22 von cscrack
  8. Autor dieses Themas

    m*4

    So dämlich bin ich auch nicht.
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!