• Hallo liebe HTML/CSS Freunde,

    ich hätte da ein kleines oder großes Problem. Ich möchte dieses Design (siehe Bild) in CCS darstellen (mit div Elementen), leider habe ich da extreme Probleme es so aussehen zu lassen.

    Kann mir da wer einen Rat geben, wie man dort am besten vorgeht?

    Gruß Loomy

  • Als hätte ich es nicht geahnt, das diese Antwort kommt.
    Ok, ja ich kann schon etwas HTML und CSS und es ging eigentlich nur darum, wie man den Aufbau am besten angehen sollte mit DIV.
    Vielleicht habe ich mich etwas falsch ausgedrückt.
    Hier mal mein Code wie ich es mir gedacht habe.

    <div id="haupt">
    <div id="obenl">obenl</div>
    <div id="obenr">obenr</div>
    <div id="bildl">bildl</div>
    <div id="bildr">bildr</div>
    <div id="balkenl">balkenl</div>
    <div id="balkenr">balkenr</div>
    <div id="links">
    <ul>
    <li>1. Text</li>
    <li>2. Text</li>
    <ul>
    </div>
    <div id="inhalt">inhalt</div>
    <div id="fussl">fussl</div>
    <div id="fussr">fussr</div>
    </div>

    und die CSS

    #html, body {
    margin: 0;
    }

    #haupt {
    width: 960.2px;
    height: 100%;
    background-color: #000000;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    }

    #obenl {
    width: 219.2px;
    height: 50;
    text-align: left;
    background-color: #aa0000;
    float:left;
    }

    #obenr {
    width: 960.2px;
    height: 50;
    text-align: left;
    background-color: #bb0000;
    }

    #bildl {
    width: 219.2px;
    height: 200;
    text-align: center;
    background-color: #aa4444;
    float:left;
    }

    #bildr {
    width: 960.2px;
    height: 200;
    text-align: center;
    background-color: #aa8888;
    margin-left: auto;
    margin-right: auto;
    }

    #balkenl {
    width: 219.2px;
    height: 200;
    text-align: center;
    background-color: #dd4444;
    float:left;
    }

    #balkenr {
    width: 960.2px;
    height: 200;
    text-align: center;
    background-color: #dd8888;
    margin-left: auto;
    margin-right: auto;
    }

    #links {
    width: 219px;
    height: 100%;
    text-align: center;
    background-color: #ff4444;
    float:left;
    }

    #inhalt {
    width: 960.2px;
    height: 100%;
    text-align: center;
    background-color: #ff8888;
    }

    #fussl {
    width: 219px;
    height: 100%;
    text-align: center;
    background-color: #ff1111;
    float:left;
    }

    #fussr {
    width: 960.2px;
    height: 100%;
    text-align: center;
    background-color: #ff3333;
    }

    Gruß Loomy

    Einmal editiert, zuletzt von Loomy (13. November 2012 um 13:24)

  • Kannst du das bitte auf irgendeinen Server kopieren und einen Link posten? Und ich hoffe, dass deine HTML-Seite noch mehr enthält, als das, was wir hier sehen.

  • Nein Leider habe ich noch keinen aktiven Server. Aber hier noch einmal die HTML Datei kpl.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3c.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
    <head>
    <title>bla</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="haupt">
    <div id="obenl">obenl</div>
    <div id="obenr">obenr</div>
    <div id="bildl">bildl</div>
    <div id="bildr">bildr</div>
    <div id="balkenl">balkenl</div>
    <div id="balkenr">balkenr</div>
    <div id="links">links</div>
    <div id="inhalt">inhalt</div>
    <div id="fussl">fussl</div>
    <div id="fussr">fussr</div>
    </div>
    </body>
    </html>

  • Ich wollte mich nur kurz melden und bekannt geben, das ich mein Layout jetzt selbst und ohne fremde Hilfe hinbekommen habe.
    Schade ist nur, das ich hier nicht gerade eine Hilfestellung bekommen habe. Wie ich schon in meinem Post geschrieben habe, hatte ich mich vielleicht falsch ausgedrückt. Ich wollte ja nur mal wissen, wie man diesen Aufbau am besten angehen würde. Das ich dann so einen Post bekomme

    Zitat

    "Indem du HTML & CSS lernst und verstehst. Dann ist das ganz einfach."

    , finde ich schon etwas traurig. Nichts des zu Trotz, wünsche ich diesem Forum noch viel Spass, mit der Hoffung, dass nicht jeder so falsch verstanden wird wie ich.

    Gruß Loomy

  • Schade ist nur, das ich hier nicht gerade eine Hilfestellung bekommen habe.


    Das ist falsch. Du hast einen Link zu einer Seite bekommen, wo man sich das relativ gut informieren kann. Und dann warst du nicht in der Lage, uns die Sache mal richtig zu präsentieren, damit man sich das mal vernünftig ansehen kann!

  • Einen Link Posten ist ja eine Sache. Aber wozu etwas Präsentieren wenn ich schon ein Bild des Aufbau gepostet habe. Ich möchte mich hier auch nicht entschuldigen, aber es wäre doch hilfreich gewesen, wenn man z.B. geschrieben hätte: " Ich würde den Aufbau wie gefolgt machen....". Eine kpl. Lösung oder einen kpl. Code wollte ich eh nicht. Aber es ist nett von dir das du auf diesen Post schnellstmöglich geantwortet hast. Also in diesem Sinne.

    Gruß Loomy

  • es wäre doch hilfreich gewesen, wenn man z.B. geschrieben hätte: " Ich würde den Aufbau wie gefolgt machen....".


    Und warum sollte man hier was schreiben, was auf CSS4You schon steht?

  • Hmm, es standen dort viele gute Sachen drinn. Es wäre nett gewesen, wenn jemand seine Erfahrung hier gepostet hätte. Z.B. das er diesen Aufbau so aufbauen würde, um evtl. Anzeigeprobleme etc. zu umgehen. Jedenfalls kenne ich das so von früher, als man solche Themen doch mehr diskutiert hat. Scheint ja nicht mehr so zu sein. Sollte ich jetzt hier zu viel wirbel gemacht haben, entschuldige ich mich für meinen Post.

    Gruß Loomy

  • Zitat

    Hmm, es standen dort viele gute Sachen drinn.

    ... und ich habe nix verstanden!?
    Du hast doch einen guten Ansatz aufgezeigt bekommen. Damit hättest du dein Layout umsetzen können.