Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 18.10.2010, 17:00
mischaef mischaef ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.10.2010
Beiträge: 47
mischaef befindet sich auf einem aufstrebenden Ast
Standard Float-Problem?

Hallo zusammen,

ich bin der neue und habe euer Forum gefunden nachdem ich nach einer Lösung für mein Problem gesucht habe. Ich denke mal dass es sich hier um ein Float-Problem handelt.

Es geht um diese Seite:

..:: Feger-Kühlung GmbH ::..

Ich denke mal dass man sofort erkennt worin das Problem besteht.

Der html-Code wäre das hier:

HTML-Code:
<body>

    <div id="wrapper">
    
        <div id="header_oben"></div>
        
        <div id="header_unten">

        
            <div id="navigation">

                <a href="index.php" id="home" title="Feger-Kühlung - Startseite"></a>
                <a href="feger-kuehlung-ueber-uns.php" id="ueber_uns_aktiv" title="Feger-Kühlung - Wir über uns..."></a>
                <a href="feger-kuehlung-service.php" id="service" title="Feger-Kühlung - Unser Service..."></a>
                <a href="feger-kuehlung-dienstleistungen.php" id="dienstleistungen" title="Feger-Kühlung - Erfahren Sie mehr über unsere Dienstleistungen..."></a>
                <a href="feger-kuehlung-referenzen.php" id="referenzen" title="Feger Kühlung - Unsere Referenzen..."></a>
                <a href="feger-kuehlung-kontakt.php" id="kontakt" title="Feger-Kühlung - Ihr Kontakt zu uns..."></a>
                <a href="feger-kuehlung-impressum.php" id="impressum" title="Feger-Kühlung - Unser Impressum..."></a>                  
                
                <div class="clear"></div>                    
                
            </div>
        
        </div>
        
        <div id="content_wrapper">
        
            <div id="col1">
            
            
            </div>
        
            <div id="col3">

            
                Text                     
            
            </div>
            
            <div class="clear"></div> 
        
        </div>
    
    </div>
    
    <div id="footer">
    
        <div id="adresse">
        
            <ul>

            	<li>Karstraße 23</li>
                <li></li>
                <li>41068 Mönchengladbach</li>
                <li></li>
                <li>Tel.: 02161 - 833188</li>
                <li></li>
            
                <li>Fax: 02161 - 833134</li>
            </ul>            
        </div>

    </div>	

</body>
Das CSS schaut so aus:

HTML-Code:
/* ==============================================================================================================

	Stylesheet: Vorlage
	
	Stand: 12.08.2008
	Datei: style.css
	
	Aufbau:
	1. Kalibrierung
	2. Allgemeine Styles
	3. Styles für Layoutbereiche
	4. Sonstige Styles

================================================================================================================= */

/* ==============================================================================================================
	1. Kalibrierung
================================================================================================================= */

* {margin: 0; padding: 0;}

html { margin: 0 auto; height: 100%; min-height: 101%;}



/*===============================================================================================================
	2. Allgemeine Styles (z.B body, h1, h2, p, links, welche nicht in Klassen oder IDs sind)
=================================================================================================================*/

body 
{
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0 auto;
    color: #545454;    
}

p
{
    line-height: 130%;
    padding-bottom: 10px;
}

img
{
    border: none;
}


/*===============================================================================================================
	3. Styles für Layoutbereiche (Wrapper, Header, Footer, Spalten, Navigation, Bilder, ect...)
=================================================================================================================*/

#wrapper
{
	width: 886px;
    margin: 0 auto;
}


/* ================== Header ================== */

#header_oben
{
    background: url('../images/header-oben.png') no-repeat;
    width: 886px;
    height: 288px;
}

#header_unten
{
    background: url('../images/header-unten.png') no-repeat;
    width: 886px;
    height: 66px;
}

/* ================== Header ende ================== */

/* ================== Navigation ende ================== */

#navigation
{
    padding: 0 0 0 28px;
}

#home
{
	display: block;
	background: url(../images/nav-home.png) 0 0 no-repeat;
	width: 83px;
	height: 40px;
	float: left;	
}


#home:hover
{
	background: url(../images/nav-home.png);
	background-position: -83px 0;
	float: left;
}

#ueber_uns
{
	display: block;
	background: url(../images/nav-ueber-uns.png) 0 0 no-repeat;
	width: 109px;
	height: 40px;
	float: left;
}

#ueber_uns:hover
{
	background: url(../images/nav-ueber-uns.png);
	background-position: -109px 0;
	float: left;
	
}

#service
{
	display: block;
	background: url(../images/nav-service.png) 0 0 no-repeat;
	width: 96px;
	height: 40px;
	float: left;
}

#service:hover
{
	background: url(../images/nav-service.png);
	background-position: -96px 0;
	float: left;
	
}

#dienstleistungen
{
	display: block;
	background: url(../images/nav-dienstleistungen.png);
	width: 180px;
	height: 40px;
	float: left;
}

#dienstleistungen:hover
{
	background: url(../images/nav-dienstleistungen.png);
	background-position: -180px 0;
	float: left;
}

#referenzen
{
	display: block;
	background: url(../images/nav-referenzen.png);
	width: 130px;
	height: 40px;
	float: left;
}

#referenzen:hover
{
	background: url(../images/nav-referenzen.png);
	background-position: -130px 0;
	float: left;
}

#kontakt
{
	display: block;
	background: url(../images/nav-kontakt.png);
	width: 100px;
	height: 40px;
	float: left;
}

#kontakt:hover
{
	background: url(../images/nav-kontakt.png);
	background-position: -100px 0;
	float: left;
}

#impressum
{
	display: block;
	background: url(../images/nav-impressum.png);
	width: 130px;
	height: 40px;
	float: left;
}

#impressum:hover
{
	background: url(../images/nav-impressum.png);
	background-position: -130px 0;
	float: left;
}

#home_aktiv
{
	display: block;
	background: url(../images/nav-home.png) 0 0 no-repeat;
    background-position: -83px 0;
	width: 83px;
	height: 40px;
	float: left;	
}


#home_aktiv:hover
{
	background: url(../images/nav-home.png);
	background-position: -83px 0;
	float: left;
}

#ueber_uns_aktiv
{
	display: block;
	background: url(../images/nav-ueber-uns.png) 0 0 no-repeat;
    background-position: -109px 0;
	width: 109px;
	height: 40px;
	float: left;
}

#ueber_uns_aktiv:hover
{
	background: url(../images/nav-ueber-uns.png);
	background-position: -109px 0;
	float: left;
	
}

#service_aktiv
{
	display: block;
	background: url(../images/nav-service.png) 0 0 no-repeat;
    background-position: -96px 0;
	width: 96px;
	height: 40px;
	float: left;
}

#service_aktiv:hover
{
	background: url(../images/nav-service.png);
	background-position: -96px 0;
	float: left;
	
}

#dienstleistungen_aktiv
{
	display: block;
	background: url(../images/nav-dienstleistungen.png);
    background-position: -180px 0;
	width: 180px;
	height: 40px;
	float: left;
}

#dienstleistungen_aktiv:hover
{
	background: url(../images/nav-dienstleistungen.png);
	background-position: -180px 0;
	float: left;
}

#referenzen_aktiv
{
	display: block;
	background: url(../images/nav-referenzen.png);
    background-position: -130px 0;
	width: 130px;
	height: 40px;
	float: left;
}

#referenzen_aktiv:hover
{
	background: url(../images/nav-referenzen.png);
	background-position: -130px 0;
	float: left;
}

#kontakt_aktiv
{
	display: block;
	background: url(../images/nav-kontakt.png);
    background-position: -100px 0;
	width: 100px;
	height: 40px;
	float: left;
}

#kontakt_aktiv:hover
{
	background: url(../images/nav-kontakt.png);
	background-position: -100px 0;
	float: left;
}

#impressum_aktiv
{
	display: block;
	background: url(../images/nav-impressum.png);
    background-position: -130px 0;
	width: 130px;
	height: 40px;
	float: left;
}

#impressum_aktiv:hover
{
	background: url(../images/nav-impressum.png);
	background-position: -130px 0;
	float: left;
}

/* ================== Navigation ende ================== */

/* ================== Content ================== */

#content_wrapper
{
    width: 794px !important;
    min-height: 400px;
    height: auto !important;  /* für moderne Browser */
    height: 400px;  /*für den IE */
    margin: 0 0 0 45px;
}

#col1
{
    float: left;
    width: 150px;
}


#col3
{
    float: right;
    width: 620px;
    min-height: 400px;
    height: auto !important;  /* für moderne Browser */
    height: 400px;  /*für den IE */
    border-left: 1px solid #b8b8b8;
    padding: 0 0 0 20px;
}

#col3 h1
{
    color: #545454;
    font-weight: bold;
    font-size: 20px;
    padding-bottom: 10px;
}

/* ================== Content ende ================== */


/* ================== Footer ================== */

#footer
{
    background: url(../images/footer-background) repeat-x;
    width: 100%;
    height: 53px;
    margin: 10px 0 0 0;    
}

#adresse
{
    margin: 0 auto;
    width: 794px;
    color: #003e90;
}

#adresse ul
{
    margin: 0 auto;
    width: 615px;
    padding: 30px 0 0 0
}

#adresse li
{
    padding: 10px;
    display: inline;
}

/* ================== Footer ende ================== */

	





/*===============================================================================================================
	4. Sonstige Styles
=================================================================================================================*/

#bild_service
{
    margin: 20px auto;
    width: 508px;
}

#bild_service img
{
    border: 1px solid #b8b8b8;
    padding: 3px;
}

Ich sitze jetzt schon eine Weile hier und sehe den Wald vor lauter Bäumen nicht. Habe auch mit clear ein wenig rumprobiert, aber keine Lösung gefunden. Das HTML und CSS sind 100% valide. Wahrscheinlich ist es - wie immer - nur eine winzige Kleinigkeit...

Daher wäre ich sehr dankbar wenn jemand da mal schauen kann. Ich kann mir gut vorstellen dass jemand anderem das Problem sofort auffällt...

Besten dank schon mal für die Mühe...

Lieben Gruß

Michael
Mit Zitat antworten
Sponsored Links