[CSS] Help! Probleem met hoogte DIV in Firefox

Status
Niet open voor verdere reacties.
M

michiel79

Gebruiker
Lid geworden
23 aug 2006
Berichten
7
Hi!

Zie www.pmdcommunicatie.nl/weblog. In IE ziet alles er goed uit: de container volgt de tekst; meer tekst, hogere DIV. In Firefox echter, werkt dit voor geen meter! De hoogte van de DIV past zich niet aan aan de tekst... De tekst loopt dus door over de onderkant van de container-div...

(Snap je het nog?)

Heb al van alles geprobeerd, hacks, omwegen, andere positionering, maar niets helpt. Jullie een oplossing? Ik wil dus graag dat de hoogte van de DIV verandert met de hoeveelheid tekst.

De codes (pas op, nogal veel...)
Code: 
<div id="container">
	<div id="content_logo">
	</div>

	<div id="content_nav">
		<div id="content_nav_lijst">
      		<ul>
    		    <li><a href="/home" class="navigatie">Home</a></li>
				<li><a href="/portfolio" class="navigatie">Portfolio</a></li>
    		    <li><a href="/diensten" class="navigatie">Diensten</a></li>
				<li><a href="/contact" class="navigatie">Contact</a></li>

				<li class="hier">Weblog</li>
   		   </ul>
 	   </div>
    </div>
<div id="content_text_links">
<h6>U bent hier | weblog</h6>
<span class="h1_weblog">Fototestje</span>
<div class="rssThumbs"><div class="rssThumbLabel">Mijn foto's</div>
<div class="rssThumbFloat">

 <a target="_blank" href="http://www.pmdcommunicatie.nl/index.php?file=thumbpop&amp;pic=3" onclick="window.open(this.href, 'popupwindow', 'width=246,height=304,resizable'); return false;"><img class="rssThumb" src="http://www.pmdcommunicatie.nl/images/3t.png" alt="" title="" /></a></div>
<div class="rssThumbFloat">
 <a target="_blank" href="http://www.pmdcommunicatie.nl/index.php?file=thumbpop&amp;pic=4" onclick="window.open(this.href, 'popupwindow', 'width=820,height=750,resizable'); return false;"><img class="rssThumb" src="http://www.pmdcommunicatie.nl/images/4t.jpg" alt="" title="" /></a></div>
<br style="clear: both;" /></div>


 
<span class="h6_weblog"> Door Michiel Doetjes | 23 uur geleden | </span><span class="h1_weblog">Testje</span>
	<p><img src="/images/3.png" alt="" /></p>

 

<span class="h6_weblog"> Door Michiel Doetjes | 2 dagen geleden | </span><span class="h1_weblog">Weblog | Testberichtje</span>
	<p>Hi!<br />
Dit is een testberichtje van het weblog.</p>

 
<span class="h6_weblog"> Door Michiel Doetjes | 2 dagen geleden | <a href="http://www.pmdcommunicatie.nl/weblog/3/weblog-testberichtje#commentaar"  class="comments_invite">reageer</a></span>
	</div>

	<div id="content_text_sidebar">
	</div>
<div class="clearer"></div>
</div>
<div id="footer"><p class="txt_footer">| &copy; 2006 | PMD|COMMUNICATIE | Valid XHTML 1.0 |</p></div>

</body>

En de CSS:
Code: 
/* lay-out */
body, html {
	margin: 0;
	padding: 0;
	background: #FFF url(/textpattern/txp_img/bg.jpg) repeat-x top left;
	text-align: center;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #FFF;
	height: 100%;
	width: 100%;
	}
	
#container {
	margin: 0 auto;
	padding: 0;
	height: 500px;
	border: 5px solid #666;
	background: #69C url(/textpattern/txp_img/bg_container.jpg) repeat-x top left;
	width: 710px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 700px;
	}

/*for Opera*/
html>body #container {
	width:700px;
	}
	
#content_logo {
	margin: 0 auto;
	padding: 0;
	width: 700px;
	height: 100px;
	background: #FFF url(/textpattern/txp_img/logo_big.jpg) no-repeat top left;
	}

#content_nav {
	margin: 0 auto;
	padding: 0;
	width: 700px;
	height: 55px;
	background: #FFF url(/textpattern/txp_img/bg_nav.jpg) repeat-x top left;
	}

#content_nav_lijst ul {
	padding-left: 40px;
	margin-left: 0;
	margin-top: 0;
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	float: left;
	width: 660px;
	}
	
#content_nav_lijst ul li { 
	margin: 0;
	margin-right: 5px;
	padding: 0;
	display: inline; 
	}
	
#content_nav_lijst ul li a {
	padding: 5px 20px 5px 20px;
	margin-right: 5px;
	color: #FFF;
	text-decoration: none;
	float: left;
	}
	
#content_nav_lijst ul li a:hover {
	background-color: #FFF;
	color: #666;
	border-bottom: 5px solid #666;
	}

#content_nav_lijst ul li.hier {
	margin-right: 5px;
	padding: 5px 20px 5px 20px;
	background-color: #FFF;
	color: #666;
	border-bottom: 5px solid #666;
	float: left;
	}
	
#content_text_links {
	margin-top: 0;
	margin-left: 10px;
	padding: 0;
	float: left;
	width: 450px;
	text-align: left;
        min-height: 450px;
        height: 450px;
	}
	
#content_text_sidebar {
	margin-top: 10px;
	margin-right: 10px;
	padding: 2px; 
	float: right;
	width: 200px;
	height: 200px;
	background: #FFF;
	}
	
#footer {
	bottom: 0;
	margin: 0 auto;
	padding: 0;
	width: 700px;
	height: 40px;
	}

.clearer {
	clear: both;
	font-size: 1px;
}

/* text */
p {
	line-height: 20px;
	}

h1 {
	margin: 0;
	padding: 0;
	font-size: 18px;
	font-weight: bold;
	}

.h1_weblog {
	margin: 0;
	padding: 0;
 	display: block;
	font-size: 18px;
	font-weight: bold;
    border-bottom: 1px dotted #FFF;
	}

h6 {                        /* BREADCRUMB */
	margin-bottom: 10px;
	padding: 0;
	font-size: 9px;
	color: #FFF;
	text-align: left;
	font-weight: normal;
        line-height: -10px;
}

.h6_weblog {                        /* WEBLOG */
	margin-bottom: 10px;
	padding: 0;
    display: block;
	font-size: 9px;
	color: #FFF;
    text-align: left;
    font-weight: normal;
    border-top: 1px dotted #FFF;
}

.h6_weblog a {
 	color: #FFF;
    text-decoration: underline;
	}
		
.txt_footer {
	margin: 0;
	padding: 0;
	font-size: 9px;
	color: #999;
	line-height: 22px;
	}

.txt_zoeken {
	color: #999;
	}

.txt_sidebar {
	color: #69C;
	font-size: 9px;
	line-height: normal;
	}

/* forms */
.zoek {
	background: #999 url("/textpattern/txp_img/bg_search.jpg") repeat-x top left;
	padding: 1px;
	margin: 5px 5px 0 0;
	border: 1px solid #999;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	color: #333;
	}

input {
   	background: #999 url("/textpattern/txp_img/bg_search.jpg") repeat-x top left;
   	border: 1px solid #999;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	color: #333;
	}

textarea {
   	border: 1px solid #999;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	color: #333;
	}

BTW: ik gebruik Textpattern als CMS, dus de HTML code is nogal vervuild...
 
Helaas! Bedankt voor de tip, maar op de een of andere manier werkt het niet... :confused:
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan