1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
  1. HTML - Webmaster Forum
  2. HTML / Webmaster Forum
  3. HTML & CSS Forum

Ebenen

  • Darkxor
  • 27. Januar 2008 um 17:00
  • Darkxor
    Prinz(essin)
    Reaktionen
    1
    Beiträge
    663
    • 27. Januar 2008 um 17:00
    • #1

    Hallo, ich suche schon länger nach Möglichkeiten, dass ich Ebenen über Bilder kriege und wurde jetzt fündig.

    Code
    <div id="layer1" style="width:200px; height:200px; [b]position:absolute[/b]; left:0px; top:20px; [b]z-index:1;[/b]">
    
    
    
    Inhalt blabla ich bin Text</p>
    </div>

    Wobei ich das dick makierte nicht verstehe.
    Jedoch habe ich diese Einstellung auch in meinem Webeditor gefunden, mit dem ich die Position schön anpassen kann.
    Aber die Browser zeigen es unterschiedlich an und wenn man das Fenster verkleinert verschiebt es sich auch noch. Gibt es da Lösungen bzw. bessere Möglichkeiten?

    Danke

    Editor: http://www.abload.de/img/editora42.png
    Firefox: http://www.abload.de/img/firefox9ab.png
    IE: http://www.abload.de/img/ie5lcw.png

  • jojo87
    der/die Göttliche
    Reaktionen
    6
    Beiträge
    3.131
    • 27. Januar 2008 um 17:13
    • #2

    Warum arbeitest du nicht mit Hintergrundbildern?

    Ansonsten setz mal ien

    Code
    * {
    margin: 0;
    padding: 0;
    }


    ganz an den Anfang deines css-codes und verwende einen vernünftigen Doctype, dann hast du auch nicht mehr so viel Probleme mit den Browsern.

    Gruß,
    Jojo


  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 27. Januar 2008 um 18:22
    • #3

    Ich rate dir von positiion absolute ebenfalls ab, weil das sehr starr ist und eigentlich nur dann benötigt wird, wenn sich zwei divs gezielt überlappen sollen.
    Weise dem div mit dem Text eine Hintergrundgrafik zu.

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • Darkxor
    Prinz(essin)
    Reaktionen
    1
    Beiträge
    663
    • 27. Januar 2008 um 18:26
    • #4

    Hallo,

    Doctype ist .html

    So, weil ich habe gar keine CSS:

    Code
    <style type="text/css">
    * {
    margin: 0;
    padding: 0;
    } 
    </style>
    Zitat

    Warum arbeitest du nicht mit Hintergrundbildern?


    Gute Frage... so?

    Code
    <body background=bild.jpg style="background-repeat:no-repeat">


    Brauch ich aber noch ne möglichkeit es in die Mitte zu kriegen..

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 27. Januar 2008 um 18:37
    • #5

    http://www.css4you.de/background-image.html

    So wie ich deine Demos verstanden habe, benötigst du das nicht für die gesamte Seite, sondern lediglich für einen div (nicht für den body). Dem musst du noch eine Breite (am besten die der Grafik) zuweisen und zentrieren:

    Code
    <div id="layer1" style="width:200px; height:200px; margin: 0 auto; background-image: url(bild.jpg); background-repeat- no-repeat;">
    
    
    
    
    
    
    Text
    </p>
    </div>

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • jojo87
    der/die Göttliche
    Reaktionen
    6
    Beiträge
    3.131
    • 27. Januar 2008 um 18:47
    • #6

    Das hier ist ein Doctype:

    Code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


  • Darkxor
    Prinz(essin)
    Reaktionen
    1
    Beiträge
    663
    • 27. Januar 2008 um 19:20
    • #7

    Danke habt mir sehr geholfen. :wink:

Tags

  • www
  • browser
  • html
  • ie
  • http
  • style
  • background
  • body
  • jpg
  • text
  • grafik
  • code
  • bild
  • auto
  • div
  • rate
  • height
  • absolute
  • css
  • image
  • repeat
  • starr
  • layer
  • hintergrundgrafik
  • divs

Benutzer online in diesem Thema

  • 1 Besucher
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™