Safari Container Positionierung

    Hallo,
    welches Template verwendest du? Passt du das selbst an?
    Auf deiner Website finde ich das Attribut clearfix im dic-Element. Bist du sicher, dass das richtig ist?
    …

    Code
    <div "clearfix" id="artikelwrapper1"> …


    Viele Grüße
    Astrid

    Hallo,


    zum Safari selbst, kann ich nichts sagen. Sehe gerade posting von Astrid. Ja, ist mir auch aufgefallen.


    Abgesehen davon, dass die ganze Seite nicht responsiv ist:
    Wenn man über Artikel 1 & Artikel 3 'hovert', sehen diese 'normal' (FF) aus. Artikel 2 ist aber verschoben. Vielleicht sieht man das deswegen im Safari nicht gleichmäßig. Da: template.css, Zeile 245:


    Code
    #artikel2 {
 transform: translate(20%, 0px);... }


    Außerdem wird für die 3 Artikel fixe pixel von 264px; genommen, statt z.B: 30%; oder so.


    Aber auch wenn ich obiges temporär ändere, kriege ich es nicht responsive hin.


    Gruß, Christine

    Danke ihr beiden,


    @astrid , das verwendete Template ist selber geschrieben und clearfix mit dem dazugehörigen css sorgt dafür das der Wrapper die Höhe der inneren Container automatisch übernimmt.


    @christine2 transform habe ich genommen um den mittleren Container mittig zu stellen was in den Standartbrowsern auch geht außer Safari und die Artikel sollen eine feste Breite haben. Responsive setze ich @media ein und eine Breite von 25% (abstände zwischen den Containern mit einbezogen) würde das Problem nicht nicht lösen denn Safari setzt den mitleren Artikel dadurch immer noch nicht mittig. Das mit den fixen Breiten ist in der Machart egal da die Wrapperbreite fix ist.

    Ist es doch, <div class="clearfix" id="menuwrapper"> ist div id="..." und class="..." in einem Element. Der Vorteil ist, du nutzt nur für class="clearfix" nur ein css was immer dann gilt wenn man einige wrapper nutzt mit div id und class in einem.

    Hallo Spike69,


    wenn ich im Quelltext schaue, erscheint das da. Siehe Bild.


    Gruß, Christine
    Na geh, wieso ist das Bild so verstümmelt.
    Schreibs hier her:


    siehe 1. Zeile.

    Hallo Mike,
    versuchs mal so:
    das ist falsch wie die anderen schon schreiben


    Code
    <div id="artikelwrapper1" "clearfix"="">    <div id="artikelwrapper" class="clearfix">


    so könnte es funktionieren (ungetestet)

    Code
    <div id="artikelwrapper" class="artikelwrapper clearfix">
        <div class="artikelwrapper-inner">
                    <div class="artikel"> mod1 </div>
                    <div class="artikel"> mod2 </div>
                    <div class="artikel"> mod3 </div>
        </div>
</div>


    in der css: .artikel { width: 33%; float:left; padding: ... }


    Ich würde aber meine templates auf bootstrap aufbauen da du ja Joomla einsetzt. Dann kööntest du row-fluid sowie span12 / span4 verwenden. Das würde dein Leben leichter machen ;)


    EDIT: ich seh grad, ... zu langsam ...