28216 sujets

CSS et mise en forme, CSS3

[Résolu] Régle millimétrée en css IE/Firefox

Bonjour,
j'utilise le css pour simuler une règle millimétrée. Mais celle-ci s'affiche correctement sous IE mais pas sous firefox et konqueror. Pouvez vous me donner un avis sur l'erreur que j'ai fait
Merci

La page est displonible sur http://lours974.homelinux.net/~lours/test/index.html

la page index.css


html {
padding : 0px;
margin : 0px;
border-width : 0px;
}

.divmaster{
border-style: solid;
border-width: 0px 0px 0px 1px ;
display: inline;
font-size: 0px;
width: 20px;
height:10px;
}

.diva{
border-style: solid ;
border-width: 0px 1px 0px 0px ;
display: inline;
width: 2px;
height:3px;
}

.divb{
border-style: solid;
border-width: 0px 1px 0px 0px;
display: inline;
width: 2px;
height: 6px;
}

.divnum{
display: inline;
width: 20px;
}



et la page index.html


<?xml version="1.0" encoding="iso-8859-15"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
  <head>
    <meta content="text/html; charset=iso-8859-15" http-equiv="content-type"/>
    <title>Index</title>
    <meta content="Vitry David Gilbert" name="author"/>
    <meta content="Test" name="description"/>
		<link rel="stylesheet" type="text/css" href="index.css"/>
  </head>
<body>
<div>
<div class="divmaster">
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="divb"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
</div>
<div class="divmaster">
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="divb"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
	<div class="diva"></div>
</div>

<br />

<div class="divnum">
0
</div>
<div class="divnum">
1
</div>

</div>
</body>
</html>

Modifié par lours974 (06 Jul 2005 - 19:59)
En fait ces div sont générés par du xmlrad, xml et xsl et servent à représenter des statistiques, leurs longueurs et hauteurs sont donc gérées dynamiquement. Certains servent ainsi à créer des histogrammes
Le programme n'est pas fait par moi et son créateur ne veut pas tout modifier sous pretexte que cela fonctionne sous IE.

Je tente donc de voir ce qui peut être changé facilement au niveau du CSS afin que tous le monde puisse profiter de la page web.

Il me semble que le problème vient du display inline qui empêche la prise en compte de height et witdh, mais je n'ai pour l'instant pas de solution.
Merci
lours974 a écrit :
En fait ces div sont générés par du xmlrad, xml et xsl et servent à représenter des statistiques, leurs longueurs et hauteurs sont donc gérées dynamiquement. Certains servent ainsi à créer des histogrammes
Le programme n'est pas fait par moi et son créateur ne veut pas tout modifier sous pretexte que cela fonctionne sous IE.

Je tente donc de voir ce qui peut être changé facilement au niveau du CSS afin que tous le monde puisse profiter de la page web.

Il me semble que le problème vient du display inline qui empêche la prise en compte de height et witdh, mais je n'ai pour l'instant pas de solution.
Merci


En effet display: inline; t'empeche de donner des dimenssions, donc remplace display: inline; par float: left;

Mais ce n'est pas fait pour ça et sans CSS tu imagines bien que ça donnera quedal.
Pour gérer tes histo, tu ferais mieux d'utilise la librairie GD de PHP (par exemple) pour créer les images qui conviennent, en tout cas, je doute de l'interet du script du créateur ni de sa compétence...
Cela fonctionne avec le float left, je te remercie pour ton aide et la rapidité de tes réponses, voici le CSS modifié si ça intéresse quelqu'un en attendant de faire quelque chose de plus propre avec les bons outils. Ca reste quand même du bidouillage

Encore merci.


html {
    padding : 0px;
    margin : 0px;
    border-width : 0px;
  }
.divmaster {
    border-style: solid;
    border-width: 0px 0px 0px 1px ;
    float:left;
    width : 19px !important;
    width: 20px;
    height:10px;
    font-size:0px;
 }
.diva {
    border-style : solid;
    border-width: 0px 1px 0px 0px;
    float:left;
    height : 3px;
    width : 1px !important;
		width : 2px;
  }
.divb {
    border-style: solid;
    border-width: 0px 1px 0px 0px;
    float:left;
    width : 1px !important;
    width: 2px;
    height: 6px;
  }
.divnum {
    float:left;
    width: 19px;
  }

Modifié par lours974 (06 Jul 2005 - 20:56)
lours974 a écrit :

Le programme n'est pas fait par moi et son créateur ne veut pas tout modifier sous pretexte que cela fonctionne sous IE.


Un programme qui ne fonctionne que dans les conditions uniques où son développeur l'a testé ne fonctionne pas :

upload/59-regle.png


Signale tout de même à ton gugusse que tout se casse la figure sous IE si l'utilisateur a juste touché aux options d'accessibilité de son navigateur, par exemple parce qu'il est un peu miro Smiley cligne
Modifié par Laurent Denis (07 Jul 2005 - 06:53)
Administrateur
Les CSS, c'est vraiment pas Gnuplot ou Statistica, désolé pour les jours de labeur du développeur. Quoique la source des données est toujours valable ...

Sinon une table avec des cellules d'1 px de large? Smiley rolleyes Smiley rolleyes Smiley rolleyes (je plaisante)
Ne nous trompons pas de cible : ce n'est pas l'utilisation détournée de CSS pour générer du contenu qui est en cause.

Dans le cadre d'un intranet où le choix de n'avoir qu'IE est assumé (même si ce n'est pas forcément un bon choix), une application destinée à IE est logique.

Dans le même intranet avec le choix Gecko (même si ce n'est pas forcément un bon choix), la même application basée sur XUL serait tout aussi logique.

Dans le même intranet avec le choix Opera (même si ce n'est pas forcément un bon choix), on utiliserait le contenu généré CSS et XHTML-Voice avec le bonheur de pouvoir écouter les résultats en plus de les lire.

Là où il y a erreur du gugusse optimisant pour IE, c'est lorsque son bidule ne marche en fait même pas... dans IE Smiley lol

Maintenant, vous allez sans doute me dire que ce n'est pas destiné à un intranet, mais à un service internet. Alors là, oui, chapeau bas, messieurs : le pire des choix a été fait Smiley rolleyes

lours974, pour te consoler de tes déboires avec le gugusse, ceci devrait t'intéresser : 1. Qui pilote les projets Internet ? et 2.L'accessibilité et les standards pour désamorcer les sources de conflits (on est en plein dedans, là).
Modifié par Laurent Denis (07 Jul 2005 - 08:09)
Sujet clos
Aller à