Evilmachine
Threadersteller
Dabei seit: 30.10.2006
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 02.02.2010 16:57
Titel CSS problem mit floatenden DIVS und der Höhe |
|
|
Hallo Leute,
sitze mal wieder an nem CSS Design welches mir die Nerven raubt.
Ich habe zwei Floatende DIVS nebeneinander. DIV A links DIV B rechts.
Bei beiden habe ich das Problem das die Höhe nicht dem Inhalt angepasst wird. Habe schon ein p clear both drunter gemacht.
Weiß einer Abhilfe??
Hier der Link http://natur.utemuehlbauer.de/index.php?id=17
Hier der Code:
CSS:
Code: | @import url("horizontal.css");
* {
padding:0;
margin:0;
}
#rechte_spalte {
float: right;
width: 330px;
height: 520px;
background-color:#fff;
}
#alles {
width:1050px;
background-color:#fff;
margin:auto;
}
body {
background-color: rgb(102,102,102);
margin:0px;
padding:0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 2em;
}
.p {
margin:0px;
padding:0px;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
text-align: inherit;
color: inherit;
line-height: inherit;
vertical-align: top;
}
p {
padding-top:0px;
margin-top:0px;
}
img {
border:0px;
}
div {
margin:0px;
padding:0px;
font-family:verdana; font-size:12px;
}
.AbsWrap {
width: 100%;
position: relative;
}
.rowWrap {
width: 100%;
}
.clearfloat {
clear:both;
height:0px;
}
a:link, a:visited{
COLOR:inherit;
text-decoration:inherit;
}
#main {
width:100%;
margin: 0px auto 0px auto;
border: 0px solid #f0f0f0;
}
#oben {
margin-left:0px;
margin-top:0px;
width:100%;
height:102px;
margin-bottom:0px;
background-image:url(bilder/bg_oben.gif);
background-repeat:no-repeat;
background-position:top right;
background-color:#ecf6f0;
}
#navigation {
margin-top:0px;
width:100%;
height:32px;
margin-bottom:0px;
background-image:url(bilder/bg_nav.gif);
background-repeat:repeat-x;
font-size: medium;
color: #FFF;
line-height: 25px;
text-indent: 25px;
}
#header {
margin-left:0px;
margin-top:0px;
width:100%;
height:150px;
margin-bottom:0px;
background-image:url(bg_header_gruen.png);
background-repeat:no-repeat;
padding-left:740px;
}
#headline {
margin-left:0px;
margin-top:0px;
height:28px;
margin-bottom:0px;
background-image:url(bilder/bg_headline.gif);
background-repeat:repeat-x;
font-size: medium;
font-weight:bold;
color: #FFF;
font-weight: bold;
line-height: 25px;
text-indent: 25px;
}
#headline:first-letter {
font-size:24px;
}
#inhalt {
width:720px;
height:700px;
float: left;
background-color:#FFF;
background-image:url(bilder/bg_inhalt_ul.gif);
background-repeat:no-repeat;
background-position: bottom left;
}
#text {
width:720px;
height:520px;
background-image:url(bilder/bg_inhalt_or.gif);
background-position:top right;
background-repeat:no-repeat;
}
#text_final {
padding:25px;
}
#zitat {
width:350px;
height:60px;
font-size:38px;
color:#000;
float: right;
margin-top:25px;
margin-right:100px;
}
.zitat {
font-size:16px;
color:#000;
}
#aktuelles {
height:130px;
}
table.tabletemplate2 {
empty-cells: show;
border-collapse: collapse;
}
caption.tabletemplate2 {
font-size: 14px;
color: rgb(102,102,102);
text-align: left;
padding-bottom: 3px;
}
th.tabletemplate2-title {
padding: 6px;
padding-left: 10px;
border-left: 1px solid rgb(153,153,153);
border-right: 1px solid rgb(153,153,153);
border-bottom: 3px solid white;
font-size: 14px;
color: white;
background-color: rgb(0,167,73);
}
td.tabletemplate2-row1-col1 {
padding: 3px;
padding-left: 10px;
border-left: 1px solid rgb(153,153,153);
border-right: 1px solid rgb(153,153,153);
border-bottom: 3px solid white;
background-color: rgb(247,247,247);
}
td.tabletemplate2-row1-col2 {
padding: 3px;
padding-left: 10px;
border-left: 1px solid rgb(153,153,153);
border-right: 1px solid rgb(153,153,153);
border-bottom: 3px solid white;
background-color: rgb(247,247,247);
}
td.tabletemplate2-row2-col1 {
padding: 3px;
padding-left: 10px;
border-left: 1px solid rgb(153,153,153);
border-right: 1px solid rgb(153,153,153);
border-bottom: 3px solid white;
background-color: rgb(240,247,241);
}
td.tabletemplate2-row2-col2 {
padding: 3px;
padding-left: 10px;
border-left: 1px solid rgb(153,153,153);
border-right: 1px solid rgb(153,153,153);
border-bottom: 3px solid white;
background-color: rgb(240,247,241);
}
td.tabletemplate2-empty {
}
/* Ueberschriften */
.headline1 {
font-size: 16px;
font-weight: bold;
color: rgb(0,167,73);
margin-bottom: 6px;
}
.headline2 {
font-size: 14px;
font-weight: bold;
color: rgb(0,102,44);
margin-bottom: 4px;
}
.headline3 {
font-size: 12px;
font-weight: bold;
color: rgb(102,102,102);
margin-bottom: 3px;
}
h1 {
font-size: 16px;
font-weight: bold;
color: rgb(0,167,73);
margin-bottom: 6px;
}
h2 {
font-size: 14px;
font-weight: bold;
color: rgb(0,102,44);
margin-bottom: 4px;
}
h3 {
font-size: 12px;
font-weight: bold;
color: rgb(102,102,102);
margin-bottom: 3px;
}
| HTML:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="./main_verein.css" media="all" />
<!--[if IE]>
<style type="text/css" media="all">.borderitem {border-style:solid;}</style>
<![endif]-->
</head>
<body>
<!-- ###DOKUMENT### begin -->
<div id="alles">
<div id="main">
<div id="oben">
<a href="index.php"><img src="http://natur.utemuehlbauer.de/fileadmin/styles/bilder/logo.gif" alt="Zurück zur Startseite" /></a>
<div id="zitat">###ZITAT###</div>
</div>
<div id="navigation">
###MENU###
</div>
<div id="header"><br />
###AKTUELLES###
</div>
<div id="headline">###HEADLINE###</div>
<div id="inhalt">
<div id="text">
<div id="text_final">
###INHALT###</div>
</div>
</div><div id="rechte_spalte">###RECHTS###</div>
</div><p style="clear: both;">
</div>
<!-- ###DOKUMENT### end -->
</body>
</html>
| Danke im Voraus.
|
|