28173 sujets

CSS et mise en forme, CSS3

bon je refais mon texte avec le code :

html :
<div id="conteneur">
	
	
	<div id="gauche">
	
	</div>	
	<div id='droite'>

	</div><!--fin de la div droite-->
	<div id="centre">

	<div id="header">
	</div>

</div><!--fin de la div centre -->
	




<div id="pied">pied de page</div>

</div><!--fin div conteneur-->

et le css
[code]#conteneur {
margin: auto;
background-color:#e8e8e8;
height:535px;
width:90%;
padding-top:10px;
}

#centre {
background-color:#fff;
overflow:auto;
text-align:center;
height:530px;
margin-right:1px;
padding-left:0px;
margin-left:0px;
}
#gauche {float:left;
width:135px;
background-color:#e8e8e8;
margin-top:0px;
padding-top:80px;
margin-right:0px;
padding-right:0px;

}


#droite {
float:right;
width:110px;
height:530px;
overflow:auto;
background-color:#fff;
border-left: 2px solid black;
text-align:center;
}
voilà jespere que cest plus clair
Modifié par akapando (15 Jun 2006 - 22:55)
Bonsoir,
Je ne vois d'overflow nullepart.
Pourrais tu détailler un peu plus?
Sache que pour faire vite que ton doctype en XHTML1.1 n'a aucune utilité actuellement etant donné que IE et même IE7 ne gère pas le type de contenu qui doit lui être associé et que tu as d'ailleurs oublié: application/xhtml+xml.
Administrateur
Bonsoir,

merci d'éditer le titre de ce sujet pour y placer la mention [ Résolu] comme l'a rappelé Hermann et à l'avenir se rappeler que la courtoisie et les balises [ code], à mettre autour du code HTML et CSS également, sont de mise sur ce Forum Smiley smile

Felipe
Modifié par Felipe (16 Jun 2006 - 23:08)
bon a priori cest ie qui ne comprends pas quoi faire de mon image...
en fait des que je reduis la fenetre, il me la bascule apres les floats...

javous que jatteins mes limites là
je vous mets une capture pour le visuel...

firefox
upload/3501-ff.JPG
et ie...

upload/3501-ie.JPG

si quelqu'un comprends... parce que là je sature Smiley decu
merci beaucoup
Modifié par akapando (17 Jun 2006 - 01:20)
Si tu ne mets pas à disposition ton code nouvellement
modifié, personne ne pourra t'aider.
Donc à default de mieux (un lien) penses à donner la totalité
de ton code.
bon alors voilà
le html :
<div id="conteneur">
		<div id="header">

haut de page
</div>
	<div id="gauche">
	
	</div>	
	<div id='droite'>
	</div>
<div id="centre">
</div><!--fin de la div centre -->
	
<div id="pied">pied de page</div>

</div><!--fin div conteneur-->


et le css :

body {
position: absolute;
}

#header 
{height: 50px;

}
#conteneur {
width:90%;
margin: auto;
background-color:#e8e8e8;
height:520px;

padding-top:10px;
}

#centre {
overflow:scroll;height:415px;
}
#gauche {float:left;
width: 150px;
}
#droite {float:right;
width: 150px;

}


jai pas reussi jai toujours ce probleme en mettant une image trop grande dans la div centre, ie la gere pas en overflow, alors qu'avec un texte ca marche bien...
il y aurait til une difference? du moins pr ie ?

merci a tout les motivés Smiley lol
moi je dis que mettre un position:absolute sur le body est la plus grosse bêtise qu'on puisse faire, vire moi ça, ça te sert à rien :o


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
	<title></title>
	<style>
	body { 
		background:#FFFFFF;
	}

	#header {
		height: 50px;
	}
	#conteneur {
		width:90%;
		margin: auto;
		background-color:#e8e8e8;
		height:520px;
		padding-top:10px;
	}

	#centre {
		overflow:scroll; height:415px;
	}
	#gauche {
		float:left;
		width: 150px;
	}
	#droite {
		float:right;
		width: 150px;
	}
	
	</style>
</head>

<body>

<div id="conteneur">
		<div id="header">

haut de page
</div>
	<div id="gauche">
	
	</div>	
	<div id='droite'>
	droite
	</div>
<div id="centre">
fdffd


</div><!--fin de la div centre -->
	
<div id="pied">pied de page</div>

</div><!--fin div conteneur-->


</body>
</html>

ok, mais tu aura une idee pour mettre ma div centrale en overflow ?

parce que là je teste pleins de trucs, mais jai du mal a trouver faut dire.
ci-joint un essai avec ton code qui marche.
redonnes ton code avec l'adresse de l'image...
Modifié par chinon37 (24 Jun 2006 - 10:26)
oui mais sous ie le pb reste le meme, je nai pas les barres de defilement actives pour limage mais sur la page...
upload/3501-Sanstitre.JPG

en jai reussi en mettant un width:70% valable uniquement pour ie, parce que là il l'interprete correctement...
cest peut etre pas parfait mais jai a peu pres le resultat souhaité, mais bon je confirme que ie me fatigue Smiley langue
à la place de "scroll", tu mets "auto" et ça marche sur IE
Correction de mon exemple
Désolé, je n'avais essayé que sur Firefox
Modifié par chinon37 (24 Jun 2006 - 14:06)
merci de te casser la tete le truc, cest que je ne connais pas la taille de la div centre , etant donnée qu'elle sadapte selon la resolution...
du coup ie rale de pas avoir le width, javais bien vu qu'en precisant un width ca corrigeait le probleme...

cest decidement pas simple Smiley langue
mais bon merci Smiley cligne
En tout état de cause, il vaut mieux que tu adaptes la taille de ton image au div. En effet, des scrolls sur une image enlevent tout l'intérêt à l'image: une image est faite pour être vue entière...