28172 sujets

CSS et mise en forme, CSS3

Je peux bouger comme avec un scroll mais c'est un scroll onrizontal. voici mon code css

body {
	background-color: #f8f8ff;
}

#nav_home {
	background-color: #000000;
	height: 45px;
	width: 24.3%;
	position: absolute;
	top: 107px;
	left: 64px;
	bottom: 0px;
	right:0px;
	color: #fff;
}

#home {
	position: relative;
	top: -5px;
	left: 135px;
}

#nav_top_10 {
	background-color: #000000;
	height: 45px;
	width: 24.3%;
	position: absolute;
	top: 107px;
	left: 424px;
	bottom: 0px;
	right:0px;
	color: #fff;
}

#top_10 {
	position: relative;
	top: -5px;
	left: 135px;
}

#nav_english {
	background-color: #000000;
	height: 45px;
	width: 24.3%;
	position: absolute;
	top: 107px;
	left: 784px;
	bottom: 0px;
	right:0px;
	color: #fff;
}

#english {
	position: relative;
	top: -5px;
	left: 135px;
}

#nav_about {
	background-color: #000000;
	height: 45px;
	width: 24.3%;
	position: absolute;
	top: 107px;
	left: 1144px;
	bottom: 0px;
	right:0px;
	color: #fff;
}

#about {
	position: relative;
	top: -5px;
	left: 135px;
}

#title {
	font-family: cursive;
	font-size: 32px;
	color: #000000;
	position: absolute;
    left: 100px;
    top: 35px;
    text-shadow: 5px 7px #00ffff;
}

#descriptions {
	font-family: fantasy;
	position: absolute;
	top: 155px;
}

Modifié par Raphael (09 Aug 2016 - 09:37)
Administrateur
Bonjour à toi aussi et bienvenue sur ce forum Smiley smile

Je n'ai pas du tout compris ton problème, je ne sais même pas s'il y a une question.

Peux-tu être plus précis ?
Bonjour Exotic,

Tout comme Raphael, j'ai un peu de mal à percevoir ta problématique. Un problème de scroll horizontal non souhaité surement mais une page d'exemple serait plus parlant. Si ton site n'est pas accessible en ligne ou si tu ne souhaite pas le dévoiler, il t'est possible de reproduire ton problème sur des services comme Codepen ou JsFiddle par exemple.

Au delà de ce problème dont tu parles, je constates des choses assez étranges dans le code CSS que tu nous montres.

Déjà, tous tes sélecteurs sont des ID. L'utilisation de classe est préférables pour bien des raisons. Smiley smile

Je vous aussi des attributs très restrictifs voir peut être même contradictoire. Par exemple pour '#nav_home' tu définies une 'width: 24.3%' mais également un 'left: 64px' et un 'right:0px'. Le cumule de ces trois règles ne laisse qu'une seule solution : que l'écran fasse 84.54px. Le cas échéant le navigateur ignorera une des valeurs de positionnement.