Firefox kennt bottom nicht?
15 Antworten
TEAM
2 Punkte
von t.quensen Geek vor über 3 Jahren
Der Firefox kennt bottom. Das Problem wird woanders liegen.
Hier wäre ein Link zu der Seite oder zumindest etwas Code hilfreich ;)
Nachträglich bearbeitet am 19.02.10 09:01
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
.copyright { position: absolute; bottom: 0px; left: 10px; padding-left: 0;
}
die seite ist http://www.gasthof-roessli.ch/typo3/
und es geht um das kleine orange scp links unten
oder wie kann ich das ganz unten behalten also auch wenn der conttent grösser wird
TEAM
0 Punkte
von t.quensen Geek vor über 3 Jahren
Versuch es mal mit
#stage { position: relative; }
position: absolute positioniert sich relativ zum nächsten Elternelement welches einen position-Wert angegeben hat.
So sagst du dem #copyright-Element dass es sich ganz unten im #stage-Container positionieren soll.
0 Punkte
von phil Heavy User vor über 3 Jahren
Nimms mir nicht übel, aber die Seite hat andere Probleme als ein bottom.
Design ist 10 Jahre an der Zeit vorbei, Quellcode ist zwar Tabellenfrei, aber alles andere als gut.
Ich weiß, dass so ein gasthof urig wirken soll, aber das ist echt zu hart.
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
Sorry das design ist nicht von mir ich mache nur das typo3 das war vorher noch schlimmer. Sie wollen das design so. Kunde ist König.
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
Aber was ist dem am code so schlimm?
0 Punkte
von haegar Newbie vor über 3 Jahren
Könnte es sein, dass es nicht .copyright {bottom: 0px; ….} heißen soll, sondern #copyright?
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
also alles versucht. aber ich bekomm das ding nicht zu unterst auf die seite.
ich lege mal das ganze css bei.
Code
/* Main stylesheet */
@import url("stylesheet_tags.css");
#sidebar {
float: left;
width: 140px;
border: 0px solid green;
}
#content {
float:right;
width: 700px;
border: 0px solid red;
text-align:center;
}
* {
margin: 0;
padding: 0;
border: 0;
color: #3D6969;
}
#kopf {
width: auto;
height:149px;
background-image: url(../../bilder/top.gif);
background-repeat: no-repeat;
}
#kopfbalken {
background: url(../../bilder/top3.gif) no-repeat 100% 45%;
width: 250px;
height: 120px;
margin-left: 620px;
}
#kopfmitte {
overflow: hidden;
background-image: url(../../bilder/topbg.jpg);
background-repeat: repeat-x;
background-position: 0 0;
width: 1000px;
}
.center_column {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
margin: 0;
padding-right: 10px;
padding-left: 10px;
padding-top: 10px;
padding-bottom: 8px;
background-color: #C6E2FF;
}
.center_column h1{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000;
margin: 0;
padding-right: 0px;
padding-left: 0px;
padding-top: 20px;
padding-bottom: 10px;
}
.center_column p{
margin: 0;
padding-right: 0px;
padding-left: 0px;
padding-top: 0px;
padding-bottom: 10px;
}
.center_column a{
color: #809085;
text-decoration: none;
}
.center_column a:hover{
text-decoration: underline;
}
#mainnavicontainer a
{
display: block;
padding-top: 3px;
padding-bottom: 3px;
color: #FFF;
width: auto;
background-color: #596458;
margin-bottom: 5px;
margin-right: 5px;
border-bottom-width: 5px;
text-decoration: none;
text-align:center;
border: 2px #536763;
border-style:inset;
}
#mainnavicontainer {
width: 111px;
height: auto;
background-color: #9bb4bb;
color: #FFF;
margin-left: 10px;
margin-right: 10px;
margin-top: 65px;
}
#mainnavicontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-family: "Palatino Linotype";
font-size: 12px;
font-weight: bold;
color: #FFF;
}
#mainnavicontainer ul li
{
margin: 0;
padding: 0;
}
#mainnavicontainer a:link;
{
color: #657469;
text-decoration: none;
}
#mainnavicontainer a:visited
{
background-color: #657469;
color: #FFF;
}
#mainnavicontainer a#current{
background-color: #9DAAA2;
}
#mainnavicontainer a:active{
background-color: #9DAAA2
}
#mainnavicontainer { position: relative; }
#copyright {
position: absolute;
bottom: 0px;
left: 10px;
padding-left: 0;
}
.copyright A {
color: #de5e28;
text-decoration: none;
}
.copyright A:hover {
color: #de5e28;
}
#wrapper {
margin: 0 auto;
width: auto;
overflow: hidden;
background-image: url(../../bilder/wrapperBg.png);
background-repeat: repeat-y;
background-position: 0 0;
}
#Info {
font-size: 0.9em;
float: right; width: 15em;
margin: 0; padding: 0;
margin-right: 5px;
margin-top: 72px;
border: 0px dashed silver;
}
#Info strong {
font-size: 1.33em;
margin: 0.2em 0.5em;
text-decoration:blink;
}
#Info p {
font-size: 1em;
margin: 0.5em;
text-decoration:blink;
}
#map3_marker_0_0 {
font-size: 80%;
}
/* slightly enhanced, universal clearfix hack */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
0 Punkte
von haegar Newbie vor über 3 Jahren
Sorry, aber jetzt scheint es doch wie gewünscht zu funktionieren (oder liegt es an meinem Rechner)?
Ich schaue gerade Deine Seite unter Ubuntu mit Firefox Version 3.5.8 an und das scp hängt unten links fest.
Vielleicht ein refresh (Ctrl+R) Deines Browsers oder ganz hart, Deinen Cash leeren?
0 Punkte
von haegar Newbie vor über 3 Jahren
Nochmals Sorry, aber es lag an mir ;)
Unter den Links “König”, “Aktuelles”, Gallerie” und “Links” funktioniert es, bei den anderen nicht.
Ich vermute, daß die Ebenen nicht stimmen, sprich eigentlich sollte doch Dein Layout aus einem Kopfteil (id = “kopf”), Haupt-/Mittelteil (id = “stage”) und einem Fußteil bestehen. Dein Fußteil wäre dann aber id = copyright. Richtig?
Dann müsste Du Doch copyright auf der gleichen Ebene setzen wie die anderen Beiden, nicht?
Oder habe ich Dein Layout komplett mißverstanden?
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
hier noch mein html template. Ich habe wohl echt nen bock drin. Das Copyright ist nicht im Fussteil sondern sollte in der linken spalte sein. Ich habe keinen footer gemacht. Sollte ich ?
Nachträglich bearbeitet am 19.02.10 11:48
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>xxxx</title>
</head>
<body>
<!-- ###DOCUMENT_BODY### -->
<div id="wrapper">
<div id="head">
<!-- ###HEADER### -->
<div id="kopfmitte">
<div id="kopf" onclick="location.href='http://www.gasthof-roessli.ch/';" style="cursor: pointer;"><div id="kopfbalken"></div>
<!-- ###HEADER### -->
</div>
<div id="stage" class="clearfix">
<div id="sidebar">
<!-- ###SIDEBAR### -->
<!-- ###HAUPT_NAVI### -->
<div id="mainnavicontainer">
<ul>
<li><a href="#">Home</a></li>
</ul>
</div>
<!-- ###HAUPT_NAVI### -->
</div>
<div id="copyright" class="copyright">
<!-- ###COPYRIGHT### -->
</div>
<!-- ###SIDEBAR### -->
</div>
<div id="Info">
<!-- ###INFO### -->
<!-- ###INFO### -->
</div>
<div id="content">
<!-- ###CONTENT### -->
<!-- ###CONTENT### -->
</div>
</div>
</div>
<!-- ###DOCUMENT_BODY### -->
</body>
</html>
0 Punkte
von haegar Newbie vor über 3 Jahren
Hast Du es jetzt doch gelöst? Jetzt scheint es überall zu funktionieren! Gratuliere!!
Betreffend copyright als footer:
Ich habe schnell etwas zusammengetippt, deshalb keine Gewähr, daß es funktioniert (sprich irgendein </div> oder sowas sicher vergessen).
TIPP: Übrigens schaue ich mir Deinen Code mit Firebug (Plugin für Firefox) an. Das zeigt einem schön plastisch die Layer-/Ebenenstruktur.
Ein Versuch ist es wert mal als footer einzusetzen!
- CODE ############
<div id=“wrapper”>
<div id=“head”>
<!— ###HEADER### —>
<div id=“kopfmitte”>
<div id=“kopf” onclick=“location.href=‘http://www.gasthof-roessli.ch/’;” style=“cursor: pointer;”>
<div id=“kopfbalken”></div>
<!— ###HEADER### —>
</div>
<div id=“stage” class=“clearfix”>
<div id=“sidebar”>
<!— ###SIDEBAR### —>
<div id=“mainnavicontainer”><ul><a href=”./home.html” >Home</a>…..</ul></div>
<div id=“adressbox”> ….</div>
<!— Haegar: HIER Raus, So Die Idee
<div id=“copyright” class=“copyright”><a href=”./impressum.html” title=“scp” >by scp</a></div>
—>
<!— ###SIDEBAR### —>
</div>
<div id=“Info”>
</div>
<div id=“content”>
….
</div>
</div>
<!—— ########### hier das Copyright ################# —>
<div id=“copyright” class=“copyright”><a href=”./impressum.html” title=“scp” >by scp</a></div>
</div>
- ENDE ##############
0 Punkte
von haegar Newbie vor über 3 Jahren
Firebug hat mir eine Fehler angzeigt auf Link “Anfahrt”:
Syntax Error:
<!DOCTYPE html
Der Code sieht so aus
<!DOCTYPE html
PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
sollte aber wahrscheinlich so sein:
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
He danke für deinen Code. Eine Frage ich verwende ja typo3. hast du bewusst nur jeweils <!— ###SIDEBAR### —> einen “-” genommen. Denn bei mir kann typo3 garnichts damit anfangen.
Kommentare
-
vor über 3 Jahrenhaegar: Nein natürlich nicht, wahrscheinlich hat der Server beim darstellen des Codes aus zwei ‘
‘ ‘‘ ein großen ‘-’ gemacht.
Wichtig, mein Code soll nur verdeutlichen was ich mit Footer gemeint habe. Er ist nicht in Typo3 getestet, sondern ist “handgemacht” ;-)
Aber Deine Site scheint nun wirklich richtig zu funktionieren :) :)
0 Punkte
von kyrosiii Nerd vor über 3 Jahren
Sie sollte wieder gehen.
Antwort schreiben
Um eine Antwort schreiben zu können, sollest du dich zuvor anmelden.
