|
|||
bottom tut nicht was es soll
ich habe nun dem tabellen-layout den rücken gekehrt und alles per css positioniert.
nun habe ich aber noch ein prob. ein bild soll immer ganz unten am browser-rand stehen, egal wie lange die seite ist. dies habe ich mitdem css befhel bottomversucht. das komische ist, sobald ich der div mit dem content eine absolute position zuweise klappt ers nicht mit dem bottom. weise ich keine absolute position zu, bzw definiere nichts für diese div klappt es mit dem bottom, aber der content schwirt quer über das layout. Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">; <html xmlns="http://www.w3.org/1999/xhtml">; <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <link href="css.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="oben"> <img src="bilder/oben2.gif" alt="oben" width="800" height="70" /> </div> <div id="bild1"> <img src="bilder/01.gif" alt="01" width="55" height="50" /> </div> <div id="navi"> <a href="index.php"><img src="bilder/15.gif" alt="index" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=bg"><img src="bilder/11.gif" alt="backgrounds" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=ss"><img src="bilder/12.gif" alt="screensaver" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=th"><img src="bilder/09.gif" alt="themes" width="138" height="21" border="0" /></a><br/> <br/> <a href="smsspruche.php"><img src="bilder/16.gif" alt="sms sprueche" width="138" height="21" border="0" /></a><br/> <br/> <a href="upload.php"><img src="bilder/upload.gif" alt="upload" width="138" height="21" border="0" /></a><br/> <br/> <a href="intern.php"><img src="bilder/intern.gif" alt="intern" width="138" height="21" border="0" /></a><br/> <br/> </div> <div id="content"> <? include ("test12.php"); ?> </div> <div id="footerback"> <img src="bilder/21.gif" alt="21" width="603" height="25" /> </div> <div id="footernavi"> <a href="#hoch">hoch</a> | <a rel="author" href="kontakt.php">Kontakt</a> | <a href="haftungsauschuss.php">Hanftungsausschuß</a></p> </div> </body> </html> Code:
body{ padding : 0; margin : 0; background-image : url(bilder/back.gif); background-repeat : repeat-y; z-index : 1; } #oben{ position : absolute; top : 0px; left : 0px; border-width:0px; } #bild1{ position : absolute; top : 67px; left : 0px; z-index : 2; border-width:0px; } #navi{ position : absolute; top : 117px; left : 55px; border-width:0px; } #content{ position : absolute; top : 130px; left : 205px; } #footerback{ position:absolute; bottom:0px; left:197px; } #footernavi{ position : absolute; bottom : 1px; left : 490px; } http://handyaner123.pyrokar.lima-city.de/test13.htm hier ist content eine id zugewiesen und somit eine absolute position. dabei wird bottom nicht richtig umgesetzt http://handyaner123.pyrokar.lima-city.de/test14.htm hier ist dem div content keine id zugewiesen und somit auch keine postion, bottom wird richtig umgesetzt und das bild und text steht trotz scrollen ganz unten |
Sponsored Links |
|
||||
Kurz gesagt, versuch den #footerback Container ( wenn es denn dieser sein sollte)innerhalb des #content Containers zusetzen und relativ zu positionieren.
Code:
#content{ position : absolute; top : 130px; left : 205px; } #footerback{ position:relative; bottom:0px; left:10px; }
__________________
"Das meiste, das man im WWW findet, ist Grundrauschen." (C. Schoenleber in de.org.ccc) Daily Garfield |
Sponsored Links |
|
|||
Schau mal in den FAQ-Thread zu 100%-Höhe bzw. "Footer Stick Alt".
|
|
|||
jepp damit hat es geklappt.
ein sehr gutes deutsches tutorial findet man zu footerStickAlt auf http://electronic-alcatraz.de/sandbo...ter-stick-alt/ Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/> <link href="fond.css" rel="stylesheet" type="text/css"> <link rel="author" title="Impressum" href="impressum.php"> <link rel="start" title="Start" href="index.php"> <link rel="up" title="Hoch" href="#hoch"> <link href="css.css" rel="stylesheet" type="text/css" /> <script language="JavaScript"> <!-- function namosw_goto_byselect(sel, targetstr) { var index = sel.selectedIndex; if (sel.options[index].value != '') { if (targetstr == 'blank') { window.open(sel.options[index].value, 'win1'); } else { var frameobj; if (targetstr == '') targetstr = 'self'; if ((frameobj = eval(targetstr)) != null) frameobj.location = sel.options[index].value; } } } // --> </script> </head> <body> <? include ("sqlinfo.php"); ?> <div id="oben"> <img src="bilder/oben2.gif" alt="oben" width="800" height="70" /> </div> <div id="bild1"> <img src="bilder/01.gif" alt="01" width="55" height="50" /> </div> <div id="dropmenu"> <? include ("bilder_menu.php"); ?> </div> <div id="navi"> <a href="index.php"><img src="bilder/15.gif" alt="index" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=bg"><img src="bilder/11.gif" alt="backgrounds" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=ss"><img src="bilder/12.gif" alt="screensaver" width="138" height="21" border="0" /></a><br/> <br/> <a href="index.php?mod=th"><img src="bilder/09.gif" alt="themes" width="138" height="21" border="0" /></a><br/> <br/> <a href="smsspruche.php"><img src="bilder/16.gif" alt="sms sprueche" width="138" height="21" border="0" /></a><br/> <br/> <a href="upload.php"><img src="bilder/upload.gif" alt="upload" width="138" height="21" border="0" /></a><br/> <br/> <a href="intern.php"><img src="bilder/intern.gif" alt="intern" width="138" height="21" border="0" /></a><br/> <br/> </div> <div id="wrapper"> <? include ("test12.php"); ?> </div> <div id="footer"> <img src="bilder/21.gif" alt="21" width="603" height="25" /> <div id="footernavi"> <a href="#hoch">hoch</a> | <a rel="author" href="kontakt.php">Kontakt</a> | <a href="haftungsauschuss.php">Hanftungsausschuß</a></p> </div> </div> </body> </html> Code:
html { height: 100%; } body{ height: 100%; padding : 0; margin : 0; background-image : url(bilder/back.gif); background-repeat : repeat-y; z-index : 1; } #oben{ position : absolute; top : 0px; left : 0px; border-width:0px; } #bild1{ position : absolute; top : 67px; left : 0px; z-index : 2; border-width:0px; } #navi{ position : absolute; top : 117px; left : 55px; border-width:0px; } #wrapper { position: relative; min-height: 100%; left : 205px; } /* IE Fix: Der IE interpretiert height als min-height */ * html #wrapper { height: 100%; } #footer { position: relative; margin-top: 0px; left:197px; } #footernavi{ position : absolute; bottom : 1px; left : 300px; } |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem CSS-Darstellung an versch. PCs | markuskoehler | CSS | 11 | 06.06.2013 16:40 |
Ausrichtung Kalender | greece4u | CSS | 20 | 14.05.2012 14:32 |
Horizontales Drop-Down Menü (Liste) mit 2 Ebenen | Christofer | CSS | 1 | 19.05.2010 15:33 |
Problem mit IE 6 / top & bottom zugleich bei einer DIV | MichaAa | CSS | 7 | 09.11.2007 00:12 |
div in container ausrichten (bottom) - 1px problem mit ie | augusto | CSS | 1 | 31.10.2006 21:04 |