% Décimale en CSS ?

**Hyuunkel** · 06/06/2011, 16h08

Bonjour à tous,

Je suis soucieux des détails et il m'arrive pardois d'avoir un légé décalage lors de centrage contolé en css.

Donc tout est dans le titre, je voulais juste posé une petite question rapide :

Existe t'il un moyen de faire prendre en compte les décimales en CSS ?

Exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
margin-left: 45,5%;

A la place de :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
margin-left: 46%;

Je précise qu'une "fausse solution" en "x px" est inutile.

Merci d'avance pour les réponses, Cordialement

**David55** · 06/06/2011, 16h16

Et 45.5%?

**Candygirl** · 06/06/2011, 17h57

Hello,

Jouer avec les décimales risque de te provoquer des différences d'interprétation d'un navigateur à l'autre, en plus des diverses interprétations des arrondis. Par exemple, opera ne les prends pas du tout en compte :-/

Niveau des arrondis, webkit et opera arrondissent toujours au nb de pixels inférieur, IE 6 (et 7 ?) au supérieur dès 0.5 tandis que FF et IE8-9 distribuent les fractions de pixels pour ne pas dépasser la largeur total (le résultat escompté quand on veut du 50%/50% sur un nombre impair)

Ton décalage provient donc vraisemblablement de là. Avant de jouer avec des décimales il faudrait voir en quoi le décalage observé est gênant pour pouvoir y remédier de la meilleure manière possible.

**Hyuunkel** · 06/06/2011, 18h28

Envoyé par Candygirl

le résultat escompté quand on veut du 50%/50% sur un nombre impair

Exact je travaille sur du 1009x761 bien jouer ^^, c'est pas plus dérangeant que ça au pire je passerai en 1010x762, c'était plus par curiosité qu'autre chose.

Merci bien pour ton explication précise en tout cas.

PS: si mon code t'intéresse et que tu veux y jeté un œil (j'ai enlevé les contenu pour évite le code inutile):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
<!--
.fond {
	position: absolute ; 
	top: 0 ;
	left: 0 ;
	height: 100% ;
	width: 100% ; 
	border: solid black 0px
} 
.menugauche {
	position: absolute ; 
	width: 90%;
	height: 47%;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: 10%;
}
.menudroite {
	position: absolute ; 
	width: 30%;
	height: 47%;
	margin-top: auto;
	margin-right:  auto;
	margin-bottom: auto;
	margin-left: 70%;
}
.contenu {
	position: relative ; 
	top: 53%;
}
.compteur {
	position: absolute ; 
	width: 0%;
	height: 0%;
	margin-top:  -10%;
	margin-right:  auto;
	margin-bottom: auto;
	margin-left: 46%;
}
-->
<!--[if IE]>
html, body {height:100%; width: 100%; margin:0; padding:0;}
<![endif]-->
</style>
</head>
<body> 
<img class="fond" src="Index/Accueil.gif" alt="">
<div class="fond">
<div class="contenu">
<div class="menugauche"></div>
<div class="menudroite"></div>
<div class="compteur"><? include("Compteur/compteur.inc"); ?></div>
</div>
</div>
</body>
</html>

**NoSmoking** · 07/06/2011, 20h18

Bonsoir,

PS: si mon code t'intéresse et que tu veux y jeté un œil (j'ai enlevé les contenu pour évite le code inutile):

ce qui m'interpelle
- pas de DOCTYPE
- le code conditionnel pour IE
- la DIV globale en position absolute

**Hyuunkel** · 09/06/2011, 13h01

Envoyé par NoSmoking

Bonsoir,

ce qui m'interpelle
- pas de DOCTYPE
- le code conditionnel pour IE
- la DIV globale en position absolute

Merci pour ton analyse, toutes critiques es bonne pour optimisé mon code

, pour être franc j'ai commencer à apprendre le CSS y'a à peine une semaine, donc je me débrouille comme je peux avec ce que je peux trouvé ^^

- Alors concernant le DOCTYPE, je n'es mis que mon code CSS et ma structure html la, tu remarquera qu'il n'y a pas de contenu (juste pour facilité la lecture de mon "script" ^^).

- Le code conditionnel IE es la pour un max de compatibilité, car si un utilisateur utilise un IE 7 standart, le full screen fonctionne pas sans.

- Pour le div globable je ne comprend pas de quoi tu parle a vrai dire, j'ai mon fond en absolute pour le full screen, et mes menus en absolute pour un bon positionnement dans ma page et que mon texte ne remonte pas par rapport au fond lors d'un F11 par exemple, en revanche le contenu est en relative...

**NoSmoking** · 09/06/2011, 18h38

Envoyé par Hyuunkel

- Alors concernant le DOCTYPE, je n'es mis que mon code CSS et ma structure html la, tu remarquera qu'il n'y a pas de contenu (juste pour facilité la lecture de mon "script" ^^).

on ne le rapellera jamais assez le DOCTYPE change la vie...

Envoyé par Hyuunkel

- Le code conditionnel IE es la pour un max de compatibilité, car si un utilisateur utilise un IE 7 standart, le full screen fonctionne pas sans.

pourquoi ne pas le mettre en commun, comme cela se pratique très souvent?

Envoyé par Hyuunkel

- Pour le div globable je ne comprend pas de quoi tu parle a vrai dire, j'ai mon fond en absolute pour le full screen, et mes menus en absolute pour un bon positionnement dans ma page et que mon texte ne remonte pas par rapport au fond lors d'un F11 par exemple, en revanche le contenu est en relative...

tu mets ton image en fond background de la DIV globale et dans ce cas elle peut, la DIV, être en positionnement normal...

**Hyuunkel** · 10/06/2011, 14h13

Envoyé par NoSmoking

on ne le rapellera jamais assez le DOCTYPE change la vie...

Tu n'as pas compris, j'en ai un doctype, ainsi qu'un contenu, je les ai seulement pas mis dans la citation de mon code, inutile puisque c'est seulement de la structure de ma page dont l'on parle...

Envoyé par NoSmoking

pourquoi ne pas le mettre en commun, comme cela se pratique très souvent?

Effectivement j'ai modifié cela, je croyais que ce paramètre s'appliquait qu'a IE...

Envoyé par NoSmoking

tu mets ton image en fond background de la DIV globale et dans ce cas elle peut, la DIV, être en positionnement normal...

J'avais essayer de procédé ainsi au début de la conception de la page, seulement avec cette méthode je n'avais pas réussi à avoir une page "auto-size" en fonction des résolutions et correctement positionné avec mes bloc...
D'où la "bidouille" que j'ai faite qui fonctionne parfaitement

**NoSmoking** · 10/06/2011, 16h06

Envoyé par Hyuunkel

Tu n'as pas compris, j'en ai un doctype, ainsi qu'un contenu, je les ai seulement pas mis dans la citation de mon code, inutile puisque c'est seulement de la structure de ma page dont l'on parle...

si si j'avais compris mais...
on ne le rappellera jamais assez le DOCTYPE change la vie...

% Décimale en CSS ?

CSS

Discussions similaires

Partager

Partager