Autor |
Nachricht |
buddel96
Threadersteller
Dabei seit: 10.06.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 10.06.2011 12:12
Titel Footer passt sich nicht flexibel an content an |
|
|
Hallo,
ich habe nun oft die kritischen Stimmen der Vorgänger gelesen, die wohl nicht richtig die Suche benutzten konnten. Bitte verzeiht mir - dass ich nun ebenfalls mit einem Problem aufwarte, was den Footer betrifft.
ich schicke gleich den code - damit ihr vielleicht meinen Denkfehler findet.
Mein footer ist blau hinterlegt und auf der unten stehenden Seite zu finden. Er hat sich unter die 2. Grafik geklebt und verlässt diesen Platz nicht mehr. Ich habe in allen nachfolgenden div´s sämtliche Positionierungen mit clear und float hin und her verändert, er setzt sich einfach nicht unter den content flexibel an.
Bitte um Hilfe!
Danke
hier code:
<body>
<div id="header"><img src="grafiken/header1.png"/></div>
<div id="grafik1"><img src="grafiken/logoscript.png"/></div>
<div id="nav">
<a href="index.html"></a>Start</a>
<a href="001.html"><span class="nav">Praxis</span></a>
<a href="002.html">Leistungen</a>
<a href="003.html">Informationen</a>
<a href="004.html">Links</a>
<a href="005.html">Aktuelles</a>
<a href="kontakt.php">Kontakt</a></div>
<div id="inhalt"><span class="blau">Team</span>
INHALT
</div>
<div id="content">Sie befinden sich hier: Praxis</div>
<div id="nav1"><a href="006.html"><img src="grafiken/button_kreislauf_blau.png"/></a></div>
<div id="nav2"><a href="007.html"><img src="grafiken/button_gastro_blau.png"/></a></div>
<div id="nav3"><a href="008.html"><img src="grafiken/button_check_blau.png"/></a></div>
<div id="inhalt_re">
FOTOS
</div>
<div id="footer">
EMAIL und IMPRESSUM
</div>
</body>
hier css:
body {
color: #2A1FAA;
background-color: #FFF;
margin: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12%;
padding-bottom: 20px;
}
a:link {
color:#808080;
text-decoration: none;
}
a:visited {
color: #808080;
text-decoration: none;
}
a:hover, a:active, a:focus {
text-decoration: none;
color: #2A1FAA;
}
#header {
margin-left: 150px;
width: 900px;
}
#grafik1 {
margin-top: 10px;
margin-left: 150px;
}
#content{
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
color: #808080;
margin-left: 150px;
width: 200px;
position: absolute;
height: auto;
margin-top: 60px;
}
.nav{
font-size: 14px;
}
#nav{
position: absolute;
margin-left: 150px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #808080;
width: 900px;
text-align: center;
}
#nav1{
position: absolute;
margin-left: 150px;
margin-top: 90px;
}
#nav2{
position: absolute;
margin-left: 150px;
margin-top: 170px;
}
#nav3{
position: absolute;
margin-left: 150px;
margin-top: 250px;
}
#inhalt{
position: absolute;
margin-left: 347px;
margin-top: 90px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #808080;
width: 500px;
line-height: normal;
height: auto;
}
#inhalt_re{
position: absolute;
margin-left: 872px;
margin-top: 90px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #808080;
width: 175px;
line-height: normal;
height: auto;
}
.blau{
color: #2A1FAA;
}
.weiss{
color: #FFF;
}
#footer{
color: #FFF;
height: 30px;
width: 900px;
background-color: #2A1FAA;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
margin-left: 150px;
padding-top: 10px;
text-align: center;
margin-top: auto;
}
hier seite: http://endopraxis-pirna.de/002.html
Zuletzt bearbeitet von buddel96 am Fr 10.06.2011 12:14, insgesamt 2-mal bearbeitet
|
|
|
|
|
mollyroellchen
Dabei seit: 01.03.2011
Ort: am Deich
Alter: 55
Geschlecht:
|
Verfasst Fr 10.06.2011 13:40
Titel
|
|
|
Schau mal hier : http://www.intensivstation.ch/templates/
Da gibts Hilfe zur selbsthilfe, einfach mit firebug gucken, wie die Kollegen das angeordnet haben oder das erforderliche Template lokal ausprobieren.
LG
Ute
|
|
|
|
|
Anzeige
|
|
|
gotoAndPlay
Dabei seit: 22.11.2006
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Fr 10.06.2011 14:28
Titel
|
|
|
Warum hast du der id inhalt_re ein position absolute gegeben?
Nimm das mal raus! Und änder das float right in left.
|
|
|
|
|
easteregg
Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht:
|
Verfasst Fr 10.06.2011 14:48
Titel
|
|
|
gotoAndPlay hat geschrieben: | Warum hast du der id inhalt_re ein position absolute gegeben?
Nimm das mal raus! Und änder das float right in left. |
Die Frage ist doch eher: Warum haben #nav, #inhalt, #content, #nav1, #nav2, #nav3 und #inhalt_re ein position: absolute... Da wunderst du dich, warum sich dein #footer an das letzte nicht-position: absolute Element anschmiegt?
Arbeite lieber mit einem dreispaltigen Layout, beispielsweise einmal float: left, einmal float: right und ein weiteres Element ohne float-Angaben.
|
|
|
|
|
gotoAndPlay
Dabei seit: 22.11.2006
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Fr 10.06.2011 20:37
Titel
|
|
|
easteregg hat geschrieben: | gotoAndPlay hat geschrieben: | Warum hast du der id inhalt_re ein position absolute gegeben?
Nimm das mal raus! Und änder das float right in left. |
Die Frage ist doch eher: Warum haben #nav, #inhalt, #content, #nav1, #nav2, #nav3 und #inhalt_re ein position: absolute... Da wunderst du dich, warum sich dein #footer an das letzte nicht-position: absolute Element anschmiegt?
Arbeite lieber mit einem dreispaltigen Layout, beispielsweise einmal float: left, einmal float: right und ein weiteres Element ohne float-Angaben. |
Da hast du natürlich recht. So genau habe ich es mir gar nicht angesehen Einmal schnell mit Firebug auf die Seite...
|
|
|
|
|
buddel96
Threadersteller
Dabei seit: 10.06.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 10.06.2011 22:57
Titel
|
|
|
Danke für eure feeds, aber es funktioniert nicht. Warum ich das so gemacht habe wie oben skizziert? Weil ich noch nicht so lange dabei bin. Ich arbeite mit dreamweaver und dacht ich stelle die Positionen fest ein. Ich habe die absoluten Positionen gelöscht und den mittleren Teil nav1,2 und 3 inhalt und inhalt_re gefloated - trotzdem bleibt der footer oben kleben?
Könnt ihr mir da noch einmal helfen?
Danke
|
|
|
|
|
gotoAndPlay
Dabei seit: 22.11.2006
Ort: -
Alter: 40
Geschlecht:
|
Verfasst Sa 11.06.2011 21:58
Titel
|
|
|
buddel96 hat geschrieben: | Danke für eure feeds, aber es funktioniert nicht. Warum ich das so gemacht habe wie oben skizziert? Weil ich noch nicht so lange dabei bin. Ich arbeite mit dreamweaver und dacht ich stelle die Positionen fest ein. Ich habe die absoluten Positionen gelöscht und den mittleren Teil nav1,2 und 3 inhalt und inhalt_re gefloated - trotzdem bleibt der footer oben kleben?
Könnt ihr mir da noch einmal helfen?
Danke |
Die bearbeitete Datei hast du noch nicht hochgeladen?
Änder deinen CSS Code so um:
Code: | #inhalt_re {
color: #808080;
float: left;
font-family: Arial,Helvetica,sans-serif;
font-size: 10px;
height: auto;
line-height: normal;
margin-left: 872px;
margin-top: 90px;
width: 175px;
} |
Aber wie easteregg schon geschrieben hat, hakt es im Grunde genommen noch an anderen Ecken!
|
|
|
|
|
buddel96
Threadersteller
Dabei seit: 10.06.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 14.06.2011 12:04
Titel
|
|
|
Danke! Also ich habe meinen Fehler dank Eurer Hilfe gefunden. Ich habe das ganze Wochenende damit zugebracht - aber es hat sich gelohnt.
Schön, dass es euch gibt.
Nun aber noch ein ganz anderes Problem - ich habe mir gerade alles im IE angesehen.
Mein ganzes Bild wackelt - die Links kann ich nicht anklicken.
Gibt es dafür eine Erklärung? Hat das mit meinem Img - Tag zu tun. Ich habe ihm border. none zugeiwesen, damit man im IE
keinen Rand darum hat.
Danke für eure Infos.
|
|
|
|
|
|
|
|
Ähnliche Themen |
footer passt sich an browsergröße an?
[CSS] Content Div überlagert Footer
Lücke zwischen Content und Footer im ff
Footer am Ende des Viewport oder Content
Footer mitwachsend zum Content bereich. CSS Code.
[CSS] Layout(Header, Sidenav, Content, Footer) mit 100% Höhe
|
|