Hilfe ich finde den Fehler nicht

zaphi67 · 4 Mai 2011

Hallöli. Ich habe eine Webseite im Floatlayout erstellt. Irgendwie kann ich die Rightbox nicht dazu überreden sich an die Leftbox anzufloaten. Ich bin echt am verzweifeln. Ich hab schon 1000 Tutorials zu diesem Thema durchgearbeitet. Irgendwie funzt es einfach nicht. Hab meiner Meinung nach alles beachtet (float, width, margin). Vieleicht hat jemand Lust und Zeit sich das mal anzusehen. Ich poste mal die Quelltexte (Ränder und Backgoundfarben dienen nur der Orientierung und sollen später entfernt werden).

die index.htm

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html14/loose.dtd">
<html>
<head>
<meta name="author" content="Marko Lorenz"/>
<title>Katholische Familienbildungsstätte Koblenz</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="text.css">
</head>
<body>
<div id="Mainbox">
    <div id="Headbox">
        <div id="Headtopbox">
            <h1 class="fbs">Katholische Familienbildungsst&auml;tte Koblenz e.V.</h1>
            <h2 class="fbs">Begegnen und Bilden</h2>
        </div>
        <div id="Headnavbox">
        </div>
    </div>
    <div id="Middlebox">
        <div id="Leftbox">
            <div id="Leftmenuetopbox">
            </div>
            <div id="Leftmenuebox">
                <ul>
                    <li><p>Unser Programm</p></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                    <li><a href="index.htm">Home</a></li>
                </ul>
            </div>
            <div id="PDF_Box">
                <img src="./images/pdf_tumb.jpg" alt="Programm Download" title="Programm Download"/>
                <p>Das komplette Programm als PDF-Download</p>
            </div>
        </div>
        <div id="Rightbox">
            <div class="Headline">
                <p>Herzlich Willkommen !</p>
            </div>
            <div id="Contentbox">
                <div id="Contenttextbox">
                    <p class="fbs">Herzlich Willkommen auf den Internetseiten der Katholische Familienbildungsstätte Koblenz.</p>
                </div>
                <div id="Contentdecobox">
                    <p class="fbs">Das p&auml;dagogische Team der Katholischen Familienbildungsst&auml;tte</p>
                </div>
            </div>
        </div>
    </div>
    <div id="Footbox">
        <div id="Foottextbox">
        </div>
        <div id="Footbottombox">
        </div>
    </div>
</div>
</body>
</html>

das style.css

Code:

html{
    background: none repeat scroll 0 0 #DDDDDD;
}
body{
}
#Mainbox{
    width:960px; margin:auto;
}
#Headbox{
    width:100%; float:left;
}
#Headtopbox{
    background-image:url("./images/system/header.gif"); height:120px; width:100%;
}
#Headnavbox{
    background-image:url("./images/system/verlauf.gif"); height:30px; width:100%;
}
#Middlebox{
    background-color:blue; width:100%; float:left;
}
#Leftbox{
    border:2px solid aqua; width:180px; min-height:400px; float:left; background-color:aqua;
}
#Leftmenuetopbox{
    background:url("./images/system/menueheader.gif") no-repeat scroll center top #FFFFFF; height:10px;
}
#Leftmenuebox{
    background:#EFEFEF;    border:1px dotted #ab0049; height:180px;/*höhe nochmal überprüfen*/
}
#PDF_Box{
    background:#EFEFEF; border:1px dotted #AB0049; display: block; margin-top: 30px; padding: 20px 40px 10px;    
}
#Rightbox{
    float:left; background-color:grey; width:760px; min-height:500px; margin-left:200px; border:2px solid aqua;
}
div.Headline{
    float:left; width:700px; height: 35px; border: 1px solid red;
    background:url("./images/logo.jpg")no-repeat  scroll left bottom transparent;
}
#Contentbox{
    float:left; width:700px; border: 1px dotted red;
}
#Contenttextbox{
    float:left; width:450px; min-height:400px; border: 1px dotted blue;
}
#Contentdecobox{
    float:left; width: 130px; min-height:400px; border: 1px dotted green;
}
#Footbox{
    border:2px solid yellow;float:left; width:100%;
}
#Foottextbox{
border:1px solid grey;
background-image:url("./images/system/verlauf.gif");
height:2em;
}
#Footbottombox{
border:1px solid grey;
background-image:url("./images/system/footer.gif");
height:30px;
}

das text.css (Textstyle, sollte nix zur Sache tun poste aber der Vollständigkeit halber mit)

Code:

body{
    color:#333333;
    font-family:Verdana,Lucida,sans-serif;
    font-size:62.5%;
}
h1.fbs{
    color:#ab0049;
    font-family: Tahoma,Verdana,sans-serif;
    font-size: 24px;
    font-weight: 300;
}
h2.fbs{
    color:#ab0049;
    font-size:16px;
    font-weight:normal;
}
div.Headline{
}
div.Headline p{
    color:#ab0049; font-family: Tahoma,Verdana,sans-serif; font-size: 18px; font-weight: normal; padding-left:45px; padding-top: 7px; margin:0 0 18px;
}

edit: Fehler gfunden.....kann gelöscht werden!!!!

Hilfe ich finde den Fehler nicht

zaphi67

Neues Mitglied

Neueste Beiträge