PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Layer Frage: Überlagerung verhindern?


nagus
2004-01-07, 09:51:27
<html>
<head>
</head>

<style>
#content {
position: absolute;
height: 100%;
background : Gray;
}

#contentText {
/* position : fixed;/*
/* position : relative; */

padding-top:190px;
padding-bottom:60px;
padding-left:176px;
}

#footer {
position:absolute;
background : Blue;
bottom: 0px;
vertical-align : bottom;
top : auto;
margin-bottom : 0px;
}
</style>

<body>
<div id="content">
<div id="contentText">
<h2>Magna sapientium civium bonorumque penuria vir consiliorum...</h2>
<p>Cum e Cilicia decedens Rhodum venissem et eo mihi de Q. Hortensi morte esset adlatum, opinione omnium maiorem animo cepi dolorem. nam et amico amisso cum consuetudine iucunda tum multorum officiorum.</p>
</div>

<div id="footer">
<table width="770" height="43" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="76">FOOTER</td>
</tr>
</table>
</div>

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



wie kann ich bei Mozilla und NS6/7 verhindern, dass sich der footer-layer und content-layer überlagern wenn das browserfenstern verkleinert wird??

MadMan2k
2004-01-07, 17:27:14
Original geschrieben von nagus
wie kann ich bei Mozilla und NS6/7 verhindern, dass sich der footer-layer und content-layer überlagern wenn das browserfenstern verkleinert wird??
Dem #contentText DIV meinst du, weil sonst gibt das ganze keinen Sinn...
aber es sollte gehen, wenn du bei #content noch eine "min-height" angibst.

nagus
2004-01-07, 19:00:40
Original geschrieben von MadMan2k
Dem #contentText DIV meinst du, weil sonst gibt das ganze keinen Sinn...
aber es sollte gehen, wenn du bei #content noch eine "min-height" angibst.

min-height? kann auch nicht funktionieren weil sich der content-bereich ja ständig ändert >> höhe des content-layers ist NIE gleich.


es soll einfach beim netscape und mozilla gleich funktionieren wie beim ie. kopier einfach den quelltext raus und schau dir das file im ie an.

Gast
2004-01-07, 22:05:55
probier mal das für mozilla:

#content {
position: absolute;
/* height: 100%; */
min-height: 100%;
background : Gray;
}



die content-box ist in der höhe veränderbar, jedoch nie kleiner ale die browserhöhe oder?

nagus
2004-01-08, 06:57:32
Original geschrieben von Gast
probier mal das für mozilla:

#content {
position: absolute;
/* height: 100%; */
min-height: 100%;
background : Gray;
}



die content-box ist in der höhe veränderbar, jedoch nie kleiner ale die browserhöhe oder?


jein.


das was in "contentText" drin steht kann beliebig groß sein. der footer soll, egal wieviel content auf einer seite ist, immer am untersten rand des browser-fensters angezeigt werden, aber NIE den content-bereich überlagern. wenn also jetzt haufenweise text im content-bereich steht, muss natürlich gescrollt werde und wenn wenig content drin ist, soll aber der footer auch ganz unten sein und nicht sofort nach dem content angazeigt werden.

Gast
2004-01-08, 08:50:26
der gepostete codeteil geht in mozilla nicht?

oder willst du eine lösung für ie und mozilla in einer datei?

nagus
2004-01-08, 11:15:55
Original geschrieben von Gast
der gepostete codeteil geht in mozilla nicht?

oder willst du eine lösung für ie und mozilla in einer datei?


um ob der code im mozilla funzt! ich hab 1.3a und da gehts. nur wird der footer im den content rein verschoben wenn ich das fenster kleiner mach

MadMan2k
2004-01-08, 16:13:05
Original geschrieben von nagus
jein.

funzt doch alles!


<!doctype html public "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
<head>
</head>
<style type="text/css">
body {
position: absolute;
min-height: 100%;
background: grey;
}

#contentText {
padding-top:190px;
padding-bottom:60px;
padding-left:176px;
}

#footer {
position: absolute;
background: blue;
bottom: 0px;
}
</style>

<body>
<div id="contentText">
<h2>Magna sapientium civium bonorumque penuria vir consiliorum...</h2>
<p>Cum e Cilicia decedens Rhodum venissem et eo mihi de Q. Hortensi morte esset adlatum, opinione omnium maiorem animo cepi dolorem. nam et amico amisso cum consuetudine iucunda tum multorum officiorum.</p>
</div>
<div id="footer">
<table width="770" height="43" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="76">FOOTER</td>
</tr>
</table>
</div>
</body>
</html>

nagus
2004-01-08, 17:54:19
Original geschrieben von MadMan2k
funzt doch alles!


<!doctype html public "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
<head>
</head>
<style type="text/css">
body {
position: absolute;
min-height: 100%;
background: grey;
}

#contentText {
padding-top:190px;
padding-bottom:60px;
padding-left:176px;
}

#footer {
position: absolute;
background: blue;
bottom: 0px;
}
</style>

<body>
<div id="contentText">
<h2>Magna sapientium civium bonorumque penuria vir consiliorum...</h2>
<p>Cum e Cilicia decedens Rhodum venissem et eo mihi de Q. Hortensi morte esset adlatum, opinione omnium maiorem animo cepi dolorem. nam et amico amisso cum consuetudine iucunda tum multorum officiorum.</p>
</div>
<div id="footer">
<table width="770" height="43" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="76">FOOTER</td>
</tr>
</table>
</div>
</body>
</html>



tut mir leid das sagen zu müssen, aber: NEIN es funzt nicht alles.

der footer (blauer bereich) soll IMMER ganz unten (bottom!) dargestellt werden und nicht irgendwo mitten in der seite. auch wenn der content mal nicht so viel platz braucht soll das ding UNTEN liegen.

Gast
2004-01-08, 18:37:37
also ich hab das jetzt in mozilla 1.5b und mozilla 1.3b getestet. in beiden ist der blaue balken unten in der ecke, wenn jedoch der contetn zu gross wird, verschiebt sich der balken nach unten.

das wolltest du doch haben oder?

nagus
2004-01-13, 09:52:24
stimmt, jetzt gehts. nur brauch ich für ns7 und mozilla spezielle stylesheets... is aber kein problem. kann ich direkt im css-file unterscheiden.

danke für eure hilfe!