16.07.2004, 10:40
|
|||
|
|||
Zitat:
Für banner2 fehlt das position: absolute Tipp  Gib jedem Element erstmal eine andere Hintergrundfarbe, nur so siehst Du was passiert. Hinterher machst Du diese wieder weg, wie willst Du denn sonst entwickeln?
__________________
</ulle> 
|
| Sponsored Links |
|
16.07.2004, 12:27
|
|||
|
|||
|
Also hier ein total einfaches Bsp.:
Code:
#banner,
#navigation,
#content,
#bottom1 {
position: absolute;
}
#banner {
width: 778px;
height: 50px;
top: 0px;
left: 0px;
background: #F0E68C;
}
#navicont {
width: 778px;
height: 335px;
top: 50px;
left: 0px;
background: transparent;
}
#navigation {
width: 168px;
height: 335px;
top: 50px;
left: 0px;
background: #FAFAD2;
}
#content {
width: 610px;
height: 335px;
top: 50px;
left: 168px;
background: #F5DEB3;
}
#bottom1 {
width: 778px;
height: 30px;
top: 385px;
left: 0px;
background: #FFF5EE;
}
.bottom { vertical-align: bottom;}
div {
margin: 0;
border: 0;
font-size: 11px;
padding: 0px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>CSS Test</title> <link href="css/styles2.css" rel="stylesheet" type="text/css"> </head> <body> <div id="banner">hier ist der banner zuhause</div> <div id="navigation"><span class="bottom">hier die Navi</span></div> <div id="content">hier steht der content</div> <div id="bottom1"><span class="bottom">Fussssszeile</span></div> </body> </html> Kann mir das bitte jemand sagen?
|
| Sponsored Links |
|
16.07.2004, 12:40
|
|||
|
|||
|
vertical-align
bezieht sich auf die Baseline des Textfluß, sofern es nicht im <td>-Tag verwendet wird. Ich denke Du hast mein Beispiel verstanden, damit rumgespielt, probiert, kapiert........... 
__________________
</ulle>
|
|
16.07.2004, 12:59
|
|||
|
|||
|
Okay.
Ich denke ich habe es endlich einigermaßen Vertsanden. Also richtet er den Text nur innerhalb des Textflusses aus! In deinem Bsp an dem img! Dann frage ich mal anders: Wie realisiert ihr immer, dass der Text nach unten kommt?? Mit einem Nullfig?? (img) Oder wie?
|
|
16.07.2004, 13:20
|
|||
|
|||
|
Zitat:
 ) sein, einen Text am unteren Ende darstellen.Dies geht nur mit absoluter/relativer Positionierung  Bedenke -> HTML und auch XHTML sind Auszeichnungssprachen, die einen TEXT-Fluß auszeichnen. Kein DESIGN-Programm CSS -> gibt schon eine Menge Möglichkeiten dem ganzen ein Aussehen zu verhelfen. weitere Infos findest Du in der Suchfunktion, das Thema ist auch schon 100 mal diskutiert ___________________ mein oben gezeigtes Beispiel ist ein TRICK
__________________
</ulle>
|
|
16.07.2004, 13:38
|
|||
|
|||
|
Bei meinen oberen einfachen Bsp habe ich alle Tag mit absolute positioniert.
Kannst du mir nicht kurz schreiben wie du den Text nach unten bringst. Ich will ungerne nur ungerne auf die unsaubere Methode eines Nullgifs zurückgreifen.
|
|
16.07.2004, 14:21
|
|||
|
|||
|
jetzt ist aber gut
Code:
<!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" xml:lang="de">
<head>
<title></title>
<style type="text/css">
<!--
html,body {
padding: 0px;
margin: 0px;
font-family: "Trebuchet MS",Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 100.01%;
background-color: #FF9911;
color: #000000;
}
#banner,
#navigation,
#content,
#bottom1 {
position: absolute;
}
#banner {
width: 778px;
height: 50px;
top: 0px;
left: 0px;
background: #F0E68C;
}
#navicont {
width: 778px;
height: 335px;
top: 50px;
left: 0px;
background: transparent;
}
#navigation {
width: 168px;
height: 335px;
top: 50px;
left: 0px;
background: #FAFAD2;
}
#content {
width: 610px;
height: 335px;
top: 50px;
left: 168px;
background: #F5DEB3;
}
#bottom1 {
width: 778px;
height: 30px;
top: 385px;
left: 0px;
background: #FFF5EE;
}
.bottom { background: #FF0000;
position: absolute;
bottom: 0px;
left: 0px;
}
-->
</style>
</head>
<body>
<div id="banner">hier ist der banner zuhause<div class="bottom">Fussssszeile</div></div>
<div id="navigation"><span class="bottom">hier die Navi</span><div class="bottom">Fussssszeile</div></div>
<div id="content">hier steht der content<div class="bottom">Fussssszeile</div></div>
<div id="bottom1"><div class="bottom">Fussssszeile</div></div>
</body></html>
Zitat:
_____________________________ Ist übrigens das gleiche wie im Beispiel von hemfrie - ich mein ja nur, das hattest Du doch auch studiert und probiert  Code:
<!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" xml:lang="de">
<head>
<title></title>
<style type="text/css">
<!--
html,body {
padding: 0px;
margin: 0px;
font-family: "Trebuchet MS",Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 100.01%;
background-color: #FF9911;
color: #000000;
}
#banner{
position: absolute;
bottom: 0;
left: 0;
background-color: #1199FF;
}
#banner2{
position: absolute;
bottom: 0;
right: 0;
background-color: #FF1199;
}
#page{
position: relative;
left: 150px;
top: 100px;
height: 200px;
width: 700px;
background: #008000;
}
p {
font-size: 0.8em;
background: #FFFFFF;
}
-->
/*]]>*/
</style>
</head>
<body>
<div id="page">
<div id="banner"> hier stehen diverse Menülinks </div>
<div id="banner2"> Sie sind eingeloggt als, XXXX XXXX </div>
</div>
weiter im Text</p>
</body>
</html>
Ich wüßte auch hier gerne ob das in allen Browsern so ist.
__________________
</ulle>
|
|
16.07.2004, 14:39
|
|||
|
|||
|
Zitat:
|
| Sponsored Links |
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| Hover effekt auf ganze TD zelle | gandalf_hh | CSS | 27 | 13.07.2011 19:06 |
| Auf-/Zuklappen mit JS | crimi | Javascript & Ajax | 7 | 23.09.2008 16:27 |
| Float hängt sich durch's padding durch. | nick | CSS | 3 | 16.01.2008 19:24 |
| Probleme mit Abständen zwischen div´s.... | darvida | CSS | 4 | 09.07.2005 18:48 |
| layout ohne tabellen | rw597678 | CSS | 3 | 23.04.2005 12:31 |
Linear-Darstellung
