Hendrik: csssupport bei möglichst vielen browsern

Hiii,
bin gerade am Basteln, meine HP (nach Kai Lahmanns) vorbild, von frames auf css umrüsten. Doch leider leider, der Markführer und Opera unterstützen meine Idee nicht so schön wie mozilla oder netscape...

Vieleicht kennt hier jemand, der/die mehr css Erfahrungen hat als ich, wie ich da frimeln kann, so wie, dem mIEs musst du anstatt margin das und das sagen...

Meine ergebnisse waren leider, dass der mIEs trotz "top:0px;left:0px;"
einen Dicken Rand baut und dass das menü nicht "position:fixed;" ist sondern scrollt =(

Bei Opera stimmt eigentlich alles, bis aus das hintergundbild, das auch mitscrollt...

das bild ist <img src="http://www.fortunecity.de/parkalleen/parkallee/612/back.jpg" border=0 alt="">

und hier ist mein quelltext:

<html>
<head>
<title></title>
<style type="text/css">
body {
 color:#004b8c;
 background-color:#888;
}
.title {
 color:#004b8c;
 background-image:url(back.jpg);
 position:fixed;
 top:0px;
 left:0px;
 width:100%;
 padding:4px;
}
.title font {
 font-family:verdana;
 font-size:18px;
 word-spacing:4px;
}
</style>
</head>
<body>

<div class="title">
 <font>start guestbook chat forum downloads games links über mich email</font>
</div>

<br>
<pre>
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890
1234567890

</pre>
</body>
</html>

  1. Hiii,

    Meine ergebnisse waren leider, dass der mIEs trotz "top:0px;left:0px;"
    einen Dicken Rand baut und dass das menü nicht "position:fixed;" ist sondern scrollt =(

    Der Rand sollte mit body {padding: 0px; oder margin 0px;} verschwinden. fixed wird vom IE ignoriert, kann man aber mit leben.

    Bei Opera stimmt eigentlich alles, bis aus das hintergundbild, das auch mitscrollt...

    Kann ich mit meinem nicht nachvollziehen (6.01 Linux)

    und hier ist mein quelltext:

    <html>
    <head>
    <title></title>
    <style type="text/css">
    body {
    color:#004b8c;
    background-color:#888;
    }
    .title {
    color:#004b8c;
    background-image:url(back.jpg);
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    padding:4px;
    }
    .title font {
    font-family:verdana;
    font-size:18px;
    word-spacing:4px;
    }
    </style>
    </head>
    <body>

    <div class="title">
    <font>start guestbook chat forum downloads games links über mich email</font>

    Bitte keine font-Tags benutzen. Wenn man dringend ein Element für die Formatierung von Inline-Textabschnitten benötigt sollte man auf span zurückgreifen und diese mit CSS formatieren.

    </div>

    Gruß Herbalizer

    1. Der Rand sollte mit body {padding: 0px; oder margin 0px;} verschwinden. fixed wird vom IE ignoriert, kann man aber mit leben.

      nicht padding (währe aber eigentlich für innenabstnde zuständig)
      aber margin

      Bei Opera stimmt eigentlich alles, bis aus das hintergundbild, das auch mitscrollt...

      Kann ich mit meinem nicht nachvollziehen (6.01 Linux)

      windows 6.03

      und hier ist mein quelltext:

      <div class="title">
      <font>start guestbook chat forum downloads games links über mich email</font>

      Bitte keine font-Tags benutzen. Wenn man dringend ein Element für die Formatierung von Inline-Textabschnitten benötigt sollte man auf span zurückgreifen und diese mit CSS formatieren.

      <span> hat also nur für css eine bedeutung und ist ein toter tag, oder wie?

      Gruß Herbalizer

      mfg aus coswig
      Hendrik

      1. <span> hat also nur für css eine bedeutung und ist ein toter tag, oder wie?

        Richtig. Span ist ansonsten völlig formatfrei. Es bildet das inline-Pendant zu div, welches ja auch ein formatloses Blocklevelelement ist.

        Gruß Herbalizer

        1. <span> hat also nur für css eine bedeutung und ist ein toter tag, oder wie?

          Richtig. Span ist ansonsten völlig formatfrei. Es bildet das inline-Pendant zu div, welches ja auch ein formatloses Blocklevelelement ist.

          Gruß Herbalizer

          schon wieder schlauer, danke

          mfg aus coswig
          Hendrik

      2. hi

        Der Rand sollte mit body {padding: 0px; oder margin 0px;} verschwinden. fixed wird vom IE ignoriert, kann man aber mit leben.

        nicht padding (währe aber eigentlich für innenabstnde zuständig)
        aber margin

        ändert mix daran, dass Opera ein body{padding:0px;} so auslegt, wie andere Browser ein body{margin:0px;}

        Grüße aus Bleckede

        Kai

        1. ändert mix daran, dass Opera ein body{padding:0px;} so auslegt, wie andere Browser ein body{margin:0px;}

          ich hab jetzt für alle fälle, wie du alle beide drin.

          Aber, dass opera 6.03 (win) den hintergrund nicht fixiert aber
          opera 6.01 (linux) das vermag, laust mich schon.

          mfg aus coswig
          Hendrik

          1. hi

            Aber, dass opera 6.03 (win) den hintergrund nicht fixiert aber
            opera 6.01 (linux) das vermag, laust mich schon.

            background-attachment:fixed ?

            Das _sollte_ gehen.. glaub' ich mal so...
            Also unter Linuxkann er das schon ewig, daher würde es mich wundern, wenn es unter Windows nicht geht.

            Grüße aus Bleckede

            Kai

            1. Hi Kai,

              Aber, dass opera 6.03 (win) den hintergrund nicht fixiert aber
              opera 6.01 (linux) das vermag, laust mich schon.

              background-attachment:fixed ?
              Das _sollte_ gehen.. glaub' ich mal so...

              ja, es _sollte_ ;)

              Also unter Linuxkann er das schon ewig, daher würde es mich wundern, wenn es unter Windows nicht geht.

              Opera hat einen Bug, bei position:fixed scrollt leider die Focus-Box weg, was dann natürlich auch :hover betrifft.

              http://jendryschik.de/wsdev/css/fixed/

              LG Orlando

              --
              SELF-TREFFEN 2002
              http://www.rtbg.de/selftreffen/
              http://www.megpalffy.org/temp/penneninhh.html

      3. moinsen,

        <span> hat also nur für css eine bedeutung und ist ein toter tag, oder wie?

        im prinzip ja, aber ich wehre mich hier gegen die bewertung "toter tag",
        genauso wie für etwa <div>, weil die beiden sind IMHO im zeitalter des css die wichtigsten elemente überhaupt geworden.
        das äußere layout wird mit absolut positionierten <div>s gemacht und innen die schrift wird zur nt mit <span>s formatiert.
        auch wenn ich <span> nicht so oft brauche, halte ich sie doch für extrem wichtig, denn, konsequent XML gedacht könnte man alle andern inline tags, die zur formatierung (<i>,<u>,<b> etc.) dienen damit abschaffen, was die parser sehr viel schlanker machen würde.

        mfg aus coswig
        Hendrik

        Fabian