28168 sujets

CSS et mise en forme, CSS3

Hauteur de div auto

bonjour,

J'ai un petit soucis, voici un code html qui contiens quelques divs et un formulaire.
Pour le moment le div conteneur a une hauteur fixe, mais quand je met sa hauteur en "auto", il perd sa hauteur et n'est pas plus haut que le <h3>

quelqu'un peut me dire comment faire pour que sa hauteur soit dynamique ?


<div id="RightC_top" class="conteneurTable">
						<div class="leftCorner"></div>
						<h3>Criteria</h3><div class="rightCorner"></div>
						<form method="post" action="rs/portfolios/{portfolioId}/sports/{sportId}/event-types" class="criteria">
							<div class="formContainer">
								<div class="required numeric labelTop firstSearch" style="width:150px; padding-right:0px;">
									<label for="portfolioName">Portfolio :</label>
									<select name="portfolioId" class="portfolioId">
									</select>
								</div>
								<div class="required numeric labelTop" id="sportList" style="width:150px; padding-right:0px;">
									<label for="sportId">Sport :</label>
									<select name="sportId" class="sportId">
									</select>
								</div>
							</div>
							<div class="button">
								<input type="submit" class="SPRIT button search btnSearch" name="search" value="" />
							</div>
						</form>
					</div><!-- END RightC_top -->





.conteneurTable h3{    
	background-image: url("../images/background_h3.gif");
    background-repeat: repeat-x;
    color: white;
    display: block;
	font-weight:normal;
    height: 22px;
    margin-bottom: 0;
    padding-left: 10px;
    padding-top: 5px;
	border-bottom:1px solid #7c7c7c;
}
.conteneurTable .rightCorner{
	background-image:url("../images/title_corner_right.gif");
	float:right!important;
	height:27px;
	width:6px;
	position:absolute!important;
	top:0px!important;
	right:-1px;
}
.conteneurTable .leftCorner{
	background-image:url("../images/title_corner_left.gif");
	float:left;
	height:27px;
	width:4px;
	position:relative;
	left:-1px;
	right:1px;
	top:0px!important;
}
.conteneurTable{
	position:relative;
	border-bottom: 1px solid #7b7b7b;
    border-left: 1px solid #7b7b7b;
    border-right: 1px solid #7b7b7b;
    height: 88px;
    width: auto;
	background-color:#F7F7F7;
}
#RightC_top div{
	float:left;
	background-color:#f7f7f7;
	position:relative;
	top:7px;
}

#RightC_top div.firstSearch{
padding-left:11px;
width:120px;
}
#RightC_top div.firstSearch input{
	width:71px;
}
#RightC_top div.secondSearch input{
padding-left:0;
width:349px;
}
#RightC_top div.thirdSearch{
padding-left:0;
top:23px;
width:200px;;
}
#RightC_top div.thirdSearch input{
	position:relative;
	top:0px;
}
#RightC_top div.button{
float:right;
position:relative;
top:21px;
margin-right:11px;
}

#RightC_top div.labelTop label{
	float:left;
	width:100%;
	margin-bottom:3px;
	display:block;
}
#RightC_top div.labelTop input[type=text]{
	background-color: #E8F3FF;
    border: 1px solid #BFC6CF;
    float: left;
    height: 20px;
    padding-top: 0;
}
form{margin:0}


Merci d'avance
Modifié par aFauchere (13 Jan 2012 - 22:04)
Sujet clos
Aller à