Enra: Positionsangaben werden vom FF nicht richtig dargestellt

Moin,
ich habe mom ein kleines Problem mit einem Bild das am linken Seitenrand zentriert erscheinen soll.
Ich habe dem Bild die ID #bildlinks gegeben.
Hier der Code aus der CSS Datei

#bildlinks
 {
         float:left;
         position:relative;
         top:50%;
         bottom:50%;
  margin-left:0px;
         }
phase 5 und der IE zeigen mir das Bild auch am linken Rand genau in der Mitte von der Seite an... nur beim FF ist das Bild oben links

kann mir hier jemand sagen, was ich dort falsch gemacht habe oder wie man das Problem lösen kann??

Danke schon mal
MfG
Enra

  1. Liebe(r) Enra,

    phase 5 und der IE zeigen mir das Bild auch am linken Rand genau in der Mitte von der Seite an... nur beim FF ist das Bild oben links

    Faustregel: Der FF macht es richtig, der IE macht es falsch. Sieht es im IE richtig aus, im FF aber nicht, dann hast Du etwas falsch gemacht.

    Manchmal sieht es im IE richtig aus, obwohl es falsch ist... aber der IE darf niemals als Prüfstein für richtig oder falsch benutzt werden!

    Zu Deinem Problem: Das Bild, um das es geht, solltest Du nicht als <img>-Element im Quelltext benutzen, sondern nur als Hintergrundbild einbinden. Im momentanen HTML-Code steht es außerdem syntaktisch falsch eingesetzt, denn ein <img>-Element muss (da es ein sogenanntes inline-Element ist) in einem Block-Element, wie z.B. <p>, <h1>, <h2...>, <li>, <dt>/<dd>, <td> etc. stehen.

    Nimm Dein <img> Element heraus und ersetze das Hintergrundbild für den <body> entsprechend:

    body {  
        background-image: url(bilder/derverein/DerVerein.gif);  
        background-position: left center;  
        background-repeat: no-repeat;  
    }
    

    Warum trägt Dein <body> eigentlich eine ID, die zudem noch aus einem nicht-inhaltsbestimmenden Namen besteht? Lasse sie weg!

    Liebe Grüße aus Ellwangen,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
    1. Hi Felix,
      dass der tag <img> ein inline-element ist wusste ich noch gar nicht^^ wieder was dazugelernt...
      aber als background image im body kann ich das bild auch nicht setzen, da der gelbe balken den man links sieht schon als background definiert ist.
      #background
       {
               background-image:url(bilder/leistelinks.jpg);
               background-repeat:repeat-y;
               background-position: 0px 100%;
               }

      gibt es keine andere lösung?
      ich möchte das bild irgendwie auch links in der mitte anzeigen können...
      mit tabellen aber ähnlichen geht das ja auch nicht.

      Mir fällt da absolut nix mehr zu ein...
      zwei background bilder im body tag gehen nicht oder???

      Gruß
      Enra

      1. Liebe(r) Enra,

        zwei background bilder im body tag gehen nicht oder???

        ich dachte da eben an das <html> Element, das man per CSS ja auch mit Eigenschaften versehen kann...

        Probiere doch diesen Code in verschiedenen Browsern aus:

        <html>  
            <head>  
                <title>Test</title>  
                <style type="text/css">  
                    html { background: yellow; }  
                    body { margin: 20px; padding: 20px; background: green; }  
                </style>  
            </head>  
            <body>  
                <h1>Test</h1>  
                <p>Kann &gt;html&lt; eine Hintergrundfarbe haben?  
            </body>  
        </html>
        

        Wäre das für Dich eine Lösung mit der Du leben kannst?

        Liebe Grüße aus Ellwangen,

        Felix Riesterer.

        --
        ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)