• hi.

    bin nicht sehr bewandert mit Css deshalb meine frage.

    verwende ein horizontales menü und möchte nun auf der rechten seite den eingeloggten user zeigen, irgendwie schaffe ich es nicht, dass dies auf der selben höhe wie dass menü angezeigt wird, sprich ohne zeilenumbruch ! Hab auch schon display:inline ausprobiert, jemand ne idee ? Mir ist klar, dass ich es aufspalten könnte like mainnav_left mainnav_right aber dass wäre doch umständlich. (mannav ist ein div mit id)

    danke

    lg kutz

    mein css für dass menü :

    #mainnav
    {
    padding-left: 2em;
    background-color: #9FA41D;

    }

    #mainnav ul
    {
    margin-top: 0em;
    margin-bottom: 0em;
    list-style-type: none;
    border-left: 1px solid #C4C769;
    line-height:165%;
    padding: 0;
    }

    #mainnav li
    {
    display: inline;
    padding: 0 10px;
    border-right: 1px solid #C4C769;
    }

    #mainnav li a
    {
    text-decoration: none;
    color: #272900;
    }

    #mainnav a:visited
    {
    color: #600;
    }

    #mainnav li a:hover
    {
    text-decoration: none;
    color: #fff;
    background-color: #272900;
    }

    In jeder noch so negativen Erfahrung liegt unter den Gefühlen das Wissen für später vergraben.

  • Hilft's vielleicht, auch <ul> - das ein Block-Element ist - mit "display: inline" zu einem Inline-Element zu machen (und nicht nur die <li>s)?

  • ohne html ist es schwer dir zu helfen, aber vielleicht hilft dir ja http://de.selfhtml.org/css/layouts/na….htm#horizontal weiter.

    generel ist selfhtml äußerst nützlich um infos bezüglich html/css/js nachzulesen.

    ich empfehle das firefox-addon firebug (https://addons.mozilla.org/de/firefox/addon/1843) zum experimentieren mit css. mit dem addon kannst du das css/html von der geladenen seite editieren, die änderungen werden dabei wie bei einem wysiwyg-editor sofort angezeigt.

    http://www.bash.org/?104052
     <NES> I download something from Napster
     <NES> And the same guy I downloaded it from starts downloading it from me when I´m done
     <NES> I message him and say "What are you doing? I just got that from you"
     <NES> "getting my song back fucker"


  • hi zuerst mal danke für die antworten, hab eure vorschläge probiert keine änderung.
    habs jetzt auch mit ner aufspaltung des mainnav probiert, ebenso dass selbe , fügt immer eine neue zeile ein weshalb dass login unter dem Mainnav auf der rechten seite sich befindet. hab gerade gemerkt, dass der IE die mainnav breiter macht, der Firefox nicht, der setzt es nur eine zeile runter

    mein jetziges css:

    #mainnav
    {
    background-color: #9FA41D;
    width:80em;
    padding: 2px 0;

    }

    #mainnav_left
    {

    }

    #mainnav_left ul
    {
    margin: 0 0 0 2em;
    padding: 0;
    list-style-type: none;
    border-left: 1px solid #C4C769;
    display: inline;
    }

    #mainnav_left li
    {
    display: inline;
    padding: 0 10px;
    border-right: 1px solid #C4C769;
    }

    #mainnav_left li a
    {
    text-decoration: none;
    color: #272900;
    }

    #mainnav_left a:visited
    {
    color: #600;
    }

    #mainnav_left li a:hover
    {
    text-decoration: none;
    color: #fff;
    background-color: #272900;
    }

    #mainnav_right
    {
    display: inline;
    float:right;
    background-color:Yellow;

    }

    #userName
    {
    font-style:italic;
    color:White;
    display:inline;
    font-weight:bold;

    }


    html

    <div id="container">
    <div id="header">
    Name of Site
    </div>
    <div id="mainnav">
    <div id="mainnav_left">
    <ul>
    <li><a href="#">asdf</a></li>
    <li><a href="">asfadf</a></li>
    <li><a href="#">asdf</a></li>
    <li><a href="">asdf</a></li>
    </ul>
    </div>
    <div id="mainnav_right">
    Logged in as <span id="userName" runat="server"></span>
    </div>
    </div>


    wär fein könnte jemand helfen (:- )

    lg kutz

    In jeder noch so negativen Erfahrung liegt unter den Gefühlen das Wissen für später vergraben.

  • für den Anfang mal ganz was Banales: Lösche mal alle Zeilenumbrüche weg. Eigentlich sollte es reichen die Zeilenumbrüche gleich nach dem <div> wegzulöschen ... klingt zwar etwas idiotisch, aber ich hatte so ein Problem schon mal ...

    *** Make it idiot proof, and someone will build a better idiot. ***

  • für den Anfang mal ganz was Banales: Lösche mal alle Zeilenumbrüche weg. Eigentlich sollte es reichen die Zeilenumbrüche gleich nach dem <div> wegzulöschen ... klingt zwar etwas idiotisch, aber ich hatte so ein Problem schon mal ...

    <div id="mainnav_right">Logged in as <span id="userName" runat="server"></span></div>


    The same problem !


    lg kutz

    In jeder noch so negativen Erfahrung liegt unter den Gefühlen das Wissen für später vergraben.

  • sodala ... jetzt hatte ich mehr Zeit. Mal abgesehen davon, dass ein <div> nicht zu ist/war, hat Dir beim "mainnav_left" das "float:left" gefehlt. Wenn Du das machst, musst Du auch die Höhe der "mainnav" festlegen. In etwa so:

    PS: Überleg Dir, ob Du den <ul> und <li> Teil überhaupt brauchst. Du könntest die <a> gleich mit inline anordnen ...

    *** Make it idiot proof, and someone will build a better idiot. ***

  • sind halt meine ersten gehversuche mit Css


    dann gleich noch Tipp: Verwende width und padding nicht in Kombination miteinander. Das wird auf Grund der unterschiedlichen Auffassung der Richtigkeit des Box-Modells bei IE und Firefox unweigerlich zu Problemen führen.

    *** Make it idiot proof, and someone will build a better idiot. ***

  • Das wird auf Grund der unterschiedlichen Auffassung der Richtigkeit des Box-Modells bei IE und Firefox unweigerlich zu Problemen führen.

    Hm? IE kann doch gar kein CSS? Der kann doch nur so lookalikes von den webstandards.

    [font=verdana,sans-serif]"An über-programmer is likely to be someone who stares quietly into space and then says 'Hmm. I think I've seen something like this before.'" -- John D. Cock[/font]

    opentu.net - freier, unzensierter Informationsaustausch via IRC-Channel!
    Hilfe und Support in Studienangelegenheiten, gemütliches Beisammensein, von und mit Leuten aus dem Informatik-Forum!

  • Der IE kann etwas, das "almost, but not entirely unlike" HTML aussieht, und das gleiche gilt auch für CSS.
    Nur, weil der IE Dateien, die mit dem Typ text/html angegeben sind, rendert, sollte man sich nicht in die Irre leiten lassen, dass er das auch wirklich nach den HTML-Regeln macht.
    Bei den Seiten, die sowohl in Brausern als auch im IE funktionieren sollen, verwende ich immer eine komplett separate Version für den IE. Mit PHP ist es auch nicht schwer, diese beiden Kategorien voneinander zu unterscheiden.

    [font=verdana,sans-serif]"An über-programmer is likely to be someone who stares quietly into space and then says 'Hmm. I think I've seen something like this before.'" -- John D. Cock[/font]

    opentu.net - freier, unzensierter Informationsaustausch via IRC-Channel!
    Hilfe und Support in Studienangelegenheiten, gemütliches Beisammensein, von und mit Leuten aus dem Informatik-Forum!

  • Hm? IE kann doch gar kein CSS? Der kann doch nur so lookalikes von den webstandards.



    So ein bledsinn, schon der IEv3 hatte rudimentären CSS Support. Der Punkt ist halt einfach, das sich IE (mit ausnahme des IE5/Mac*) einfach nicht an die W3C Normen hält und einfach eigene Regel erfindet, und deshalb ist die darstellung am IE, naja sagen wir mal, fehlerhaft.

    Übrigens sind Browser Verteiler nicht wirklich empfohlen, da es den Wartungsaufwand verdoppelt und dreifacht, und die Verbreitung von nicht W3C-Standard-konformen XHTML / CSS schürt. Interessand zu diesem Thema "Webdesign mit Webstandards" von Jeffrey Zeldman.


    *hielt sich an den damaligen standard

    2 Mal editiert, zuletzt von Myc0rrhizal (4. September 2008 um 13:36)

  • Alles, das den CSS-Standard ignoriert, ist kein CSS.

    Es gibt einen großen Unterschied zwischen fehlerhafter oder unvollständiger Implementationen, oder bewussten Andersinterpretationen.

    [font=verdana,sans-serif]"An über-programmer is likely to be someone who stares quietly into space and then says 'Hmm. I think I've seen something like this before.'" -- John D. Cock[/font]

    opentu.net - freier, unzensierter Informationsaustausch via IRC-Channel!
    Hilfe und Support in Studienangelegenheiten, gemütliches Beisammensein, von und mit Leuten aus dem Informatik-Forum!

  • Alles, das den CSS-Standard ignoriert, ist kein CSS.

    Es gibt einen großen Unterschied zwischen fehlerhafter oder unvollständiger Implementationen, oder bewussten Andersinterpretationen.


    ich glaube, wir verzetteln uns da etwas in Details und "Religionsfragen". Tatsache ist, dass IE "eigene Vorstellungen von Standards" hat bzw. einige Sachen nicht standardkonform interpretiert. Wenn man aber einige dieser "Probleme" richtig adressiert, so kommt man mit nur einem .css file (ohne Browserweichen) ganz gut aus. Auch ich halte nicht viel davon, ein eigenes CSS file pro Browser einzubinden.

    *** Make it idiot proof, and someone will build a better idiot. ***

  • Ein Browser ist ja kein CSS, oder wie meinst du das?

    Ich rede von "CSS-Support", der ja nicht direkt was mit den Standards zu tun hat wenn ich CSS (Cascading Style Sheets) als Technik ansehe und das Doctype oder das Scheme (k.A. wie das vom W3C definiert wird) f. die jewilige Version ist ja wieder was anderes.

    Soweit ich weiß wird CSS3 in Paketen kommen und ein Browser kann entscheiden welche Pakete integriert werden, das ist dann auch CSS-Support, unterstütz dann aber vlt. nich alle funktionen bzw. Standards

    Aber grundsätzlich gebe ich dir Recht, ich bin ein IE Gegner wenns um CSS geht, aber CSS-Support hatter.

  • wieso sind alle so scharf darauf, dass ihre seite in IE genau so ausschaut wie in ff? wenn der IE zu dumm ist, und der user zu dumm, einen gescheiten browser zu verwenden, gibts halt keine tollen animationen, etc.

    jemand, der einen alten SW-Röhren-Fernseher hat, kann auch kein HDTV in Farbe empfangen. Des selbe gilt z.B. für IE6 (Industrie-Standard, aber SW-Röhre) im Vergleich zu FF2/FF3/Opera9/Safari. Tough crap, aber kann man nix machen. Und die Browserweichen für unterschiedliche Browser zahlen sich schon aus (z.B. die conditinional comments oder wies heissen, mit denen du bestimmte Versionen vom IE aussortieren kannst)

    allgemeinerer Tipp: verwende für unterschiedliche aufgaben unterschiedliche CSS-Dateien. (eine Datei für Farben, eine für Layout, eine für Schriftsatz.) IMHO sind die einzelnen Bereiche viel effizienter zu ändern.

    @For3st
    das CSS3 Beispiel ist schlecht gewählt. Grundsätzlich ist es so - IE7 z.B. hat sich an die CSS2.1-Standards schon ziemlich angenähert, interpretiert aber z.B. das Boxmodell anders als das W3C es vorschlägt. Damit unterstützt der IE7 schlicht und ergreifend den CSS 2.1 Standard nicht - größtenteil, aber nicht komplett. Selbiges gilt übrigens auch bei einigen Kleinigkeiten für den FireFox, aber bei wichtigen Dingen (Box-Model) ist er standard-konform.

    Ist ein bisserl so wie bei den HD-Ready Sachen. Nicht der volle Standard, aber sowas ähnliches, mit ein paar Sachen halt kastriert. Der IE7 ist halt auch CSS2.1-ready (nachdem es den Standard jetzt seit ~10 jahren gibt!)

    Für mich denkt mdk!

    Einmal editiert, zuletzt von Bobsch (5. September 2008 um 11:44)

  • Ja, wie in so vielen Bereichen hat Microsoft Rückwärtskompatiblität einer guten Implementierung vorgezogen.

    [font=verdana,sans-serif]"An über-programmer is likely to be someone who stares quietly into space and then says 'Hmm. I think I've seen something like this before.'" -- John D. Cock[/font]

    opentu.net - freier, unzensierter Informationsaustausch via IRC-Channel!
    Hilfe und Support in Studienangelegenheiten, gemütliches Beisammensein, von und mit Leuten aus dem Informatik-Forum!

  • okay, die rückwärtskompatibilität wir von vielen leuten aber auch gefordert (warum kann ich unter vista mein office 97 bitte nicht mehr betreiben, schweinerei?)

    genauso - warum muss ich meine homepage jetzt auf einmal an standards anpassen damit sie im neuen IE7 nicht wie müll aussieht?

    Für mich denkt mdk!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!