28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J’essaye d’utiliser des feuilles de style pour mettre en page un site.
Quand je mets des pixels pour la mise en page ça fonctionne presque bien car j’ai quelque problème en fonction du navigateur que j’utilise mais dans l’ensemble ça va.

Mais je souhaiterai plutôt utiliser des % que des pixels cela fonctionne si je laisse mon site statique mais je souhaiterai que la mise en page s’agrandisse en fonction de l’écran et de la résolution de l’utilisateur, cela fonctionne aussi. Mais j’ai un problème lors de la réduction du navigateur car les différents DIV de la page se chevauchent ainsi que le contenu donc il faudrait que dés une certaine limite de réduction le site ne se réduise plus et que des ascenseurs apparaissent en bas du navigateur mais je ne parviens pas a le faire.

Merci pour votre aide.
Bonjour également,

Et plus concrètement, à quoi ressemble-t-il ce site ? Comment les différents blocs conteneurs sont-ils positionnés ? Peut-on voir le site en ligne, une page de test reproduisant le problème ou encore le code HTML et CSS ?
le site n'est pas encore en ligne
il resemble a ça:
upload/10497-site.jpg

j'ai utilisé la propriété min-width mais elle ne focntionne pas avec IE

J'ai donc utilisé width:expression(document.body.clientWidth < 740 ? "740px" : "auto" ); pour IE6, mais elle fais planter le navigateur

j'ai une fonction PHP qui me permet de savoir quel navigateur utilise le site.

en esperant que vous pouvez m'aider
Chaque rectangle est d'un div que veux tu savoir de plus ? moi je souhaiterai savoir pourquoi width:expression(document.body.clientWidth < 740 ? "740px" : "auto" ); ne fonctionne pas
Il me semble que les deux valeurs doivent être différentes par exemple :
width:expression(document.body.clientWidth < 742 ? "740px" : "auto" );
ça ne fonctionne pas non plus le navigateur plante aussi avec
width:expression(document.body.clientWidth < 742 ? "740px" : "auto" );

Je fais un if dans ma page PHP si le navigateur est IE voici le CSS associé
#Mise_IE {
position: relative;
margin-left: auto;
margin-right: auto;
width:expression(document.body.clientWidth < 742 ? "740px" : "auto" );
height:820px;
/*text-align: left;*/
/*top:20px;*/
background-color: #3300CC;
border: thin solid #FFFFFF;
/*overflow: visible;*/
}
ça ne fonctionne pas non plus le navigateur plante aussi avec
width:expression(document.body.clientWidth < 742 ? "740px" : "auto" );

Je fais un if dans ma page PHP si le navigateur est IE voici le CSS associé

#Mise_IE {
	position: relative;
	margin-left: auto;
	margin-right: auto;
        width:expression(document.body.clientWidth < 742 ? "740px" : "auto" );
	height:820px;
	background-color: #3300CC;
	border: thin solid #FFFFFF;
	}

Si le navigateur n'est pas IE

#Mise_Autre {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width:90%;
	height:820px;
	text-align: left;
	background-color: #3300CC;
	border: thin solid #FFFFFF;
	min-width:700px;
	}

Modifié par nico313 (20 Jan 2007 - 21:07)
nico313 a écrit :
Chaque rectangle est d'un div que veux tu savoir de plus ?

Dans quel ordre les blocs sont présents dans le code et comment ils sont imbriqués ?
Quel est le type de contenu qu'ils accueillent ?
Quels sont les styles qui s'appliquent à ces blocs ?
Un image ne dit rien de tout ça.

nico313 a écrit :
moi je souhaiterai savoir pourquoi width:expression(document.body.clientWidth < 740 ? "740px" : "auto" ); ne fonctionne pas

Dans l'absolu, cette méthode ne fait pas planter Internet Explorer 6. Le problème peut donc venir de ta configuration (problème potentiel avec des versions standalone d'Internet Explorer 6 et 7), ou bien du code que tu as réalisé. Si c'est le deuxième cas, il pourrait utile de pouvoir tester la page présentant le problème avec tous les éléments du contexte, pas juste en sachant que tu as utilité telle ligne de code.