zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden z-index im ie6 - hilfe nötig

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 15.08.2008, 11:42
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.08.2008
Beiträge: 8
Felixus befindet sich auf einem aufstrebenden Ast
Standard z-index im ie6 - hilfe nötig

Hallo Leute,

ich bin noch ein newbie in Sachen Webdesign, aber ich kämpf mich durch

Hier mein Problem vereinfacht:
Drei Boxen
Header-Box mit 100px.
Content-Box mit 500px.
Und eine dritte Box, die Logo heißt mit 200px.

Logo-Box soll Header komplett überlappen und Content-Box 100px
überlappen.

Ich habe rumprobiert, gesucht usw. nix richtiges gefunden für den ie6
Der ie6 überlappt Header komplett aber nicht Content sondern drückt
Content runter so dass ich zwischen Header und Content einen
Zwischenbereich habe.
Ich will aber, dass Content auch überlappt wird.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- -->

<script type="text/javascript" charset="utf-8">/*<![CDATA[*/

/*]]>*/</script>

<style type="text/css">
body {

background-color: #ffffff;
color: #000000;
font-family: Georgia, "Trebuchet MS", Verdana, Arial, Sans-Serif;
text-align: center;
}

* {
border: 0;
margin: 0;
outline: 0;
padding: 0;
}

#container {
background: transparent;
height: 100%;
width: 100%;
}

#header {
background-color: green;
height: 100px;
width: 100%;
margin: 0px auto;
z-index: 1;
position: relative;
}

#logo {
background-color: red;
border: 1px solid white;
height: 260px;
width: 700px;
margin: 0px auto;
z-index: 3;
position: relative;
}

#bodyContent {
background-color: yellow;
border: 0px solid white;
height: 306px;
width: 100%;
margin: 0px auto;
z-index: 2;
position: relative;
}

</style>

<title> title </title>
</head>

<body>
<div id="container">

<div id="header">

</div>
<!-- header end -->

<div id="logo"></div>

<div id="bodyContent">

</div>
<!-- bodyContent end -->

</div>
</body>
</html>

------------------
Danke für eure Hilfe. Ich komme leider nicht weiter.

Felix
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.08.2008, 12:03
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Hi,

bei position:relative; hält die so positionierte Box ihren Platz weiterhin besetzt, selbst wenn sie verschoben wird.

mit position:absolute nimmst du sie komplett aus dem Textfluß und die anderen Elemente verhalten sich so als wäre das absolut pos. Element nicht da.

Vielleicht solltest du #logo absolut positionieren. Dann sollte allerdings #container position:relative; bekommen, damit sich das absolut pos. #logo daran orientieren kann.

Gruß
Klaus
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 15.08.2008, 21:46
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.08.2008
Beiträge: 8
Felixus befindet sich auf einem aufstrebenden Ast
Standard

leider funktioniert das auch nicht.

Hat keine eine Idee ?

Felix
Mit Zitat antworten
  #4 (permalink)  
Alt 15.08.2008, 22:24
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Hi,

was soll denn daran nicht funktionieren?

Hast du das so geändert?
Code:
#container {
position:relative;
background: transparent;
height: 100%;
width: 100%;
}
#logo {
position:absolute;
left:0;
top:0;
background-color: red;
border: 1px solid white;
height: 260px;
width: 700px;
margin: 0px auto;
z-index: 3;

}
Wenn du das so geändert hast funktioniert es doch, zumindest bei mir.

Gruß
Klaus
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #5 (permalink)  
Alt 16.08.2008, 08:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.08.2008
Beiträge: 8
Felixus befindet sich auf einem aufstrebenden Ast
Standard

Hi,

ich habe deine Veränderungen vorgenommen und vom #bodyContent z-index:2; bzw. position: relative; rausgenommen und danach hat es geklappt.

Wie kann ich die #logo zentrieren?
So ist die Box linksbündig.

Danke für deine Mühe.

Felix
Mit Zitat antworten
  #6 (permalink)  
Alt 16.08.2008, 08:48
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Moin,

Zitat:
Zitat von Felixus Beitrag anzeigen
und vom #bodyContent z-index:2; bzw. position: relative; rausgenommen und danach hat es geklappt.
naja, das hätte es nicht gebraucht, hat bei mir auch ohne das geklappt.

Zitat:
Zitat von Felixus Beitrag anzeigen
Wie kann ich die #logo zentrieren?
So ist die Box linksbündig.
wenn #logo z.B. width:50%; und left:25%; bekommt.

Gruß
Klaus
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
  #7 (permalink)  
Alt 17.08.2008, 13:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.08.2008
Beiträge: 8
Felixus befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für deine Hilfe.

Habs jetzt endlich wie ichs haben wollte.

Gruß
Felix
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Hilfe - IE6 verschiebt navigation nach unten hausi86 CSS 3 25.01.2010 18:38
Kontaktformular Hilfe nötig :) sunny55 CSS 2 05.08.2008 19:29
Hilfe beim Layout im IE6 skreilos CSS 0 12.03.2008 18:19
Hilfe bitter nötig villain CSS 11 05.10.2004 09:24


Alle Zeitangaben in WEZ +2. Es ist jetzt 23:48 Uhr.