Stefan: Feld will nicht an die Stelle, wo ich will

Hallo,
über ein Tutorial habe ich gesehen, wie man ein DIV einblenden kann.
Das ist sehr schön, aber es will mir nicht gelingen, das DIV links neben den Link zu plazieren.
Hier ist das Beispiel, aber es öffnet immer unter dem Link. Ich möchte genau das selbe, nur links neben dem Link.
Ich habe versucht, die class über css zu definieren, aber es gelingt mir einfach nicht.
Wie bekomme ich das Textfeld links neben den Link?

Stefan

  1. Hier ist das Beispiel,

    'Schuljung. Ich habe den Link vergessen.
    http://jsbin.com/uzoni
    Stefan

    1. Hier ist das Beispiel,

      'Schuljung. Ich habe den Link vergessen.
      http://jsbin.com/uzoni

      Das Thema wäre dein  <div>Show</div>
      Du solltest aber für dein Input Feld eh ein <label> Verwenden.
      anyway: Du musst das betreffende Element schlicht als display:inline präsentieren.

      mfg Beat

      --
      ><o(((°>           ><o(((°>
         <°)))o><                     ><o(((°>o
      Der Valigator leibt diese Fische
      1. anyway: Du musst das betreffende Element schlicht als display:inline präsentieren.

        mfg Beat

        Hallo Beat,
        jo, dachte ich auch. Hat aber nicht den gewünschten Effekt gehabt.
        Bei Form-Tags habe ich das schon öfter erfolgreich verwendet, diesmla ist mir das nicht gelungen.
        Viele Grüße Stefan

      2. Mit <div class="hide" style="float:left;">
        klappts.

        1. Mit <div class="hide" style="float:left;">
          klappts.

          Danke Mark.
          Leider passt das aber noch nicht mit meinen anderen Elementen zusammen.
          Irgendwie krückt das hinten und vorne.
          Ich probier noch ein bißchen.
          Stefan

        2. @@mark:

          nuqneH

          Mit <div class="hide" style="float:left;">
          klappts.

          Das einzige (und letzte) Mal, dass man bei Inline-Style-Angabe von „klappen“ sprechen kann, ist, wenn endlich der Deckel über ihnen zuklappt.

          CSS gehört nicht in 'style'-Attribute, sondern ins Stylesheet.

          Qapla'

          --
          Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
          1. CSS gehört nicht in 'style'-Attribute, sondern ins Stylesheet.

            Qapla'

            Behauptet wer??

            Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe und kann mit einem style-Attribut die Arbeit erschlagen, 6 Dateien editieren zu müssen, dann mach ICH das.

            Zhqkldo'

            1. Hallo,

              CSS gehört nicht in 'style'-Attribute, sondern ins Stylesheet.
              Behauptet wer??

              behaupten einige Leute, die sich schon längere Zeit mit der Erstellung von Webseiten beschäftigen.

              Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe ...

              ... dann frage ich mich: Warum so viele? Ich vermute, man könnte das Projekt günstiger strukturieren, so dass man mit einem Stylesheet auskommt.

              und kann mit einem style-Attribut die Arbeit erschlagen, 6 Dateien editieren zu müssen, dann mach ICH das.

              Das sei dir unbenommen; ICH würd's nicht tun. Denn es widerspricht dem Ziel, Inhalt (HTML) und Gestaltung (CSS) zu trennen. Wenn ich Inline-Styles verwende, wäre die Gefahr groß, dass ich irgendwann, wenn ich das Projekt mal wieder anfassen muss, Änderungen im zentralen Stylesheet mache und mich wundere, warum die nicht wirken.

              So long,
               Martin

              --
              Ich bin 30. Ich demensiere apokalyptisch.
                (Orlando)
              1. behaupten einige Leute, die sich schon längere Zeit mit der Erstellung von Webseiten beschäftigen.

                Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe ...

                ... dann frage ich mich: Warum so viele? Ich vermute, man könnte das Projekt günstiger strukturieren, so dass man mit einem Stylesheet auskommt.

                Aber nicht, wenn man gleichzeitig auf die "Leute, die sich schon längere Zeit mit der Erstellung von Webseiten beschäftigen" hört, die IE-Hacks verunglimpfen.
                Außerdem darf doch jeder soviele Styles für seine Projekte anbieten, wie er Spaß daran hat?
                Wie würdest Du die denn in 1 css-Datei unterbringen wollen?

                Wenn ich Inline-Styles verwende, wäre die Gefahr groß, dass ich irgendwann, wenn ich das Projekt mal wieder anfassen muss, Änderungen im zentralen Stylesheet mache und mich wundere, warum die nicht wirken.

                Das stimmt.

                mfg Stefan

                1. Hi,

                  Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe ...
                  ... dann frage ich mich: Warum so viele? Ich vermute, man könnte das Projekt günstiger strukturieren, so dass man mit einem Stylesheet auskommt.
                  Aber nicht, wenn man gleichzeitig auf die "Leute, die sich schon längere Zeit mit der Erstellung von Webseiten beschäftigen" hört, die IE-Hacks verunglimpfen.

                  okay, damit habe ich kein Problem; ich ziehe CSS-Hacks auch den CCs vor, wenn ich für IE spezielle Anpassungen brauche.

                  Außerdem darf doch jeder soviele Styles für seine Projekte anbieten, wie er Spaß daran hat?

                  Klar. Wenn's Spaß macht. :-)

                  Wie würdest Du die denn in 1 css-Datei unterbringen wollen?

                  Wen? Was? Die sechs einzelnen Stylesheets?
                  Fragt sich zunächst, *warum* du mehrere hast.

                  Wenn es IE-Anpassungen sind, siehe oben.
                  Wenn es darum geht, Screen- und Print-Stylesheet unterschiedlich zu gestalten, tendiere ich auch noch zu zwei getrennten Stylesheets.
                  Eventuell sind deine Seiten modular aufgebaut, und jeder Block (Navi, Hauptinhalt, Footer) hat sein eigenes Stylesheet. Kann ich nachvollziehen, ich würde sie dennoch zusammenfassen.
                  Andere Gründe für die Pflege mehrerer Stylesheets wollen mir im Moment nicht einfallen.

                  So long,
                   Martin

                  --
                  Paradox ist, wenn der Innenminister sich äußert und der Außenminister sich erinnert.
                  1. Wenn es darum geht, Screen- und Print-Stylesheet unterschiedlich zu gestalten, tendiere ich auch noch zu zwei getrennten Stylesheets.

                    So ist es auch. Trotzdem hast Du ja recht, meist sind 70-80% identisch. ich denk mir dazu mal ne spezielle Lösung aus. Und melde mich dann damit.

                    Stefan

                2. hi,

                  Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe ...

                  Wie würdest Du die denn in 1 css-Datei unterbringen wollen?

                  ich Minifiziere.

                  return array(  
                       'css' => array('//css/file1.css', '//css/file2.css', '//css/file3.css')  
                  );
                  

                  HTML
                  <link type="text/css" rel="stylesheet" href="/min/?g=css" />

                  Was am Ende hinten rauskommt, sieht zwar nicht mehr so schön aus, dass macht aber nichts.

                  Nachteil/ Vorteil ist das Aggressive Caching -- dem kann man mit einer einfachen Funktion entgegen wirken (ich hab mir was für Smarty geschrieben). Einfach das Änderungsdatum aller CSS-Files auslesen und hinten dranhängen.

                  <link type="text/css" rel="stylesheet" href="/min/?g=css;1260763136" />

                  mfg

                  1. Wie würdest Du die denn in 1 css-Datei unterbringen wollen?

                    ich Minifiziere.

                    return array(

                    'css' => array('//css/file1.css', '//css/file2.css', '//css/file3.css')
                    );

                    
                    >   
                    > HTML  
                    > `<link type="text/css" rel="stylesheet" href="/min/?g=css" />`{:.language-html}  
                      
                      
                    Öhm. Das kapier ich nicht.  
                      
                    Aber sagt nicht Dein Array auch aus, dass Du mehrere .css-Dateien hast?  
                      
                    Oder sind das alles Teildateien, die zu einer zusammengefasst werden?  
                      
                    Ich verstehe das System dahinter nicht. Erklärst Du mir das mal?  
                      
                    Grüße
                    
                    1. hi,

                      return array(

                      'css' => array('//css/file1.css', '//css/file2.css', '//css/file3.css')
                      );

                        
                      
                      > Aber sagt nicht Dein Array auch aus, dass Du mehrere .css-Dateien hast?  
                      >   
                      > Oder sind das alles Teildateien, die zu einer zusammengefasst werden?  
                        
                      Genau das; Minify führt im Hintergrund alle Dateien zusammen, minifiziert sie und liefert sie dann komprimiert aus.  
                      Nur Minify weiss, dass du 6 CSS-Dateien hast, die Browser laden nur eine CSS, die zu dem von unnötigen Kommentaren und Whitespaces befreit ausgeliefert wird.  
                        
                      Der aufruf sagt lediglich:  
                      `<link type="text/css" href="/min/?g=css" />`{:.language-html}  
                        
                      /min/     -> Verzeichnis von Minify  
                      ?g        -> ist Gruppe  
                      =css      -> 'css'  
                        
                      Minify erledigt den rest:  
                      `'css' => array('//css/file1.css', '//css/file2.css', '//css/file3.css')`{:.language-php}  
                        
                      Minify führt im Hintergrund alle CSS zusammen und speichert diese Intern in einer neuen Datei ab, um sich die arbeit beim nächsten aufruf zu sparen.  
                        
                      [So sieht es dann Fertig aus](http://dj-tut.de/min/?g=css) (komprimiert ca. 4,6 KB)  
                      [Und hier die richtige CSS](http://dj-tut.de/css/dj_style_1) (ca. 19,2 KB -- ich brauche nur eine)  
                        
                      mfg
                      
                      -- 
                      [Obamas greatest speech all times!](http://www.youtube.com/watch?v=-84V_aWXNS0)
                      
                    2. @@Stefan:

                      nuqneH

                      Oder sind das alles Teildateien, die zu einer zusammengefasst werden?
                      Ich verstehe das System dahinter nicht. Erklärst Du mir das mal?

                      Unterschiede zwischen Datei (das, was auf der Festplatte des Serversystems liegt) und Ressource (das, was der Server über HTTP ausliefert)!

                      Du kannst CSS-Dateien haben so viele wie du willst, solLtest aber genau eine CSS-Ressource ausliefern. ↗[PERFORMANCE-BP1]

                      Qapla'

                      --
                      Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
              2. Hallo Martin!

                Wenn ich Inline-Styles verwende,

                ... dann befinde ich mich noch in der Testphase, und da finde ich sie sehr praktisch, auch aufgrund der höheren Spezifizität, um schnell Formatierungsanpassungen zu testen.

                Wenn alles zusammenpasst, wie ich mir das wünsche, suche ich mit der Suchfunktion meines Editors projektweit nach »style="«, und übernehme die Inline-Styles ins zentrale Stylesheet (in der Regel sind das eh wenige).

                Viele Grüße aus Frankfurt/Main,
                Patrick

                --
                _ - jenseits vom delirium - _

                   Diblom   [link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash]
                J'ai 10 ans! | Achtung Agentur! | Nichts ist unmöglich? Doch! | Heute schon gegökt?
                1. Wenn ich Inline-Styles verwende,
                  ... dann befinde ich mich noch in der Testphase, und da finde ich sie sehr praktisch, auch aufgrund der höheren Spezifizität, um schnell Formatierungsanpassungen zu testen.

                  Bietet sich heuer Firebug an, als temporäre Modifikation.

                  Wenn alles zusammenpasst, wie ich mir das wünsche, suche ich mit der Suchfunktion meines Editors projektweit nach »style="«, und übernehme die Inline-Styles ins zentrale Stylesheet (in der Regel sind das eh wenige).

                  Wobei du wegen den Spezialformatierungen dann ev. noch eine ID oder Klasse nachträglich brauchst. Also musst du nachtrählich noch mehr patchen.
                  Das ist der Punkt, wo es ebenso bequem ist, diese IDs oder Klassen zu setzen und im zentralen CSS-File-Block über diese Selektoren zu experimentieren.

                  mfg Beat

                  --
                  ><o(((°>           ><o(((°>
                     <°)))o><                     ><o(((°>o
                  Der Valigator leibt diese Fische
                2. @@Patrick Andrieu:

                  nuqneH

                  Wenn alles zusammenpasst, wie ich mir das wünsche, suche ich mit der Suchfunktion meines Editors projektweit nach »style="«, und übernehme die Inline-Styles ins zentrale Stylesheet (in der Regel sind das eh wenige).

                  Doppelte Arbeit? Nein danke.

                  Qapla'

                  --
                  Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
                  1. Hallo Gunnar!

                    Doppelte Arbeit? Nein danke.

                    Wie man's sieht. Für mich wäre es mehr Arbeit, mühsam nach Testformatierungen in einem zentralen Stylesheet, das schnell viele Zeilen erreicht hat, im Nachhinein zu suchen...

                    Viele Grüße aus Frankfurt/Main,
                    Patrick

                    --
                    _ - jenseits vom delirium - _

                       Diblom   [link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash]
                    J'ai 10 ans! | Achtung Agentur! | Nichts ist unmöglich? Doch! | Heute schon gegökt?
                3. Hi,

                  Wenn ich Inline-Styles verwende,

                  ... dann befinde ich mich noch in der Testphase, und da finde ich sie sehr praktisch, auch aufgrund der höheren Spezifizität, um schnell Formatierungsanpassungen zu testen.

                  Wenn alles zusammenpasst, wie ich mir das wünsche, suche ich mit der Suchfunktion meines Editors projektweit nach »style="«, und übernehme die Inline-Styles ins zentrale Stylesheet

                  ... wobei die Spezifität sich dadurch wieder ändern kann, und dann wieder die Sucherei losgeht.

                  MfG ChrisB

                  --
                  “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
            2. Wenn ICH für ein Projekt 6 verschiedene Stylesheet-Dateien habe und kann mit einem style-Attribut die Arbeit erschlagen, 6 Dateien editieren zu müssen, dann mach ICH das.

              Das macht nur Sinn für Seitenspezifisches CSS, oder Layouts im Entwurfstadium.
              Wann immer du aber zu früh seitenspezifisch arbeitest, droht dir später mehr redundante Patcharbeit.
              Den Aspekt Datentransfervolumen erwähne ich nur am Rande.

              mfg Beat

              --
              ><o(((°>           ><o(((°>
                 <°)))o><                     ><o(((°>o
              Der Valigator leibt diese Fische
              1. @@Beat:

                nuqneH

                [style-Attribut] macht nur Sinn für Seitenspezifisches CSS

                Auch dort nicht. Die Angaben sind gesammelt im 'style'-Element im 'head' besser aufgehoben als verstreut in '@style'-Attributen.

                Oder gleich im externen Stylesheet: Das 'html'-Element erhält eine seitenspezifische ID; die seitenspezifischen Regeln im Stylesheet per Nachfahrenselektor.

                oder Layouts im Entwurfstadium.

                Und im nächsten Stadium macht man sich die Arbeit, die '@style'-Attribute zu entfernen und die Regeln ins Stylesheet zu übertragen? Die Arbeit kann man sich sparen, wenn man es gleich richtig macht.

                Qapla'

                --
                Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
                1. [style-Attribut] macht nur Sinn für Seitenspezifisches CSS
                  Auch dort nicht. Die Angaben sind gesammelt im 'style'-Element im 'head' besser aufgehoben als verstreut in '@style'-Attributen.

                  Doch. Sei nicht absolutistisch.
                  Gib ein Balkendiagramm aus, zum Beispiel.

                  mfg Beat

                  --
                  ><o(((°>           ><o(((°>
                     <°)))o><                     ><o(((°>o
                  Der Valigator leibt diese Fische
                  1. Hi,

                    Die Angaben sind gesammelt im 'style'-Element im 'head' besser aufgehoben als verstreut in '@style'-Attributen.

                    Doch. Sei nicht absolutistisch.
                    Gib ein Balkendiagramm aus, zum Beispiel.

                    Das ist zunächst mal - Stichwort Zugänglichkeit - eine Liste von Werten.
                    Daraus Balken zu generieren, überlasse ich JavaScript.

                    MfG ChrisB

                    --
                    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
          2. CSS gehört nicht in 'style'-Attribute, sondern ins Stylesheet.

            Qapla'

            Ja. das stimmt. Hab mir aber gedacht bei dem beispiel handelt es sich nur um eine Testseite, wo es nicht unbedingt nötig ist extra eine *.css Deitei zu erstellen. Außerdem arbeitet der Fragensteller selbst in seinem Beispiel mit style= sodaß ich das einfach übernommen hab.

    2. @@Stefan:

      nuqneH

      'Schuljung. Ich habe den Link vergessen.
      http://jsbin.com/uzoni

      Stimmt.

      Qapla'

      --
      Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)