28220 sujets

CSS et mise en forme, CSS3

Mise en forme en pourcentage, les naviguateurs savent ils compter ?

Bonjour tout le monde,

Voila mon problème est assez simple je suis en train de faire une site pour ue entreprise et elle désire un site construit sous forme liquid (redimenssionement automatique). Ca tombe bien car j'ai toujours fait mes sites comme cela mais cette fois j'ai du flash qui va avec . Ce fut très dur mais j'ai réussi à avoir quelque chose de potable mais jai tout de même des problèmes .

J'ai l'impression que ie ne sait pas compter :
Quand on met 2 divs dans un conteneur ou meme 3 (sous forme de colonnes) et qu'on donne une taille width en pourcentage à ces divs qui à eux trois feront 100%.
ex : 20 % 80% 20%.
Cela marche mais quand on redimenssione la fenêtre certaines fois une des div passe en dessous mais seulement à certains moment non définissable donc impossible de regler le problème sans en avoir la cause.

Concernant firefox lui aussi à un petit souci le conteneur est décallé d'1 pixel sur la droite et cette fois j'ai pas envi de faire du bricolage, il doit y avoir une solution ou une explication pkoi 20 + 60 + 20 ne font pas 100% tout le temps Smiley ohwell

Voila l'adresse du site en question :

http://mtdo.info/adag/index.php

Merci d'avance Smiley cligne

ps: d'ailleurs pour le banner avec la partie flash cette partie était vraiment difficile à mettre en liquid et ayant perdu patience avec ce problème de pourcentage j'ai cédé avec un <table> mais je ne tiens pas à pourrir tout mon code avec ca.
Petit précision :

Pour les autres sites que j'ai fait en liquid j'avais trouvé une solution en tatonnant :

Elle consiste à donner au block conteneur une taille superieur à 100 % genre 101% et gèrer ensuite avec le pourcentage des divs à l'interieur et bizzarement ca fonctionnait mais cette méthode ne me satisfait pas je la trouve trop complex pour être la seul.

Merci a+
Merci pour ce lien . Ce que je dois donc en conclure c'est qu'il n'y a pas de moyen de faire un site avec un design fluide ? ca serait vraiment vraiment décourageant. Dans les commentaires de l'article de raphael des personnes propose donc une des seuls solution qui est de mettre un total infèrieur du style 60 % et 39% le problème c'est que cela m'est impossible dans le design que je suis en train de faire puisque j'ai du utiliser de blocs pour faire des cotés ombrés donc un bloc avec background sur tout le coté gauche et un bloc à l'interieur avec un background sur tout le coté droit si je met 1 %de moins on verra un gros décallage par rapport à l'entete quoi qu'il en soit il y aura toujours cette différence entre ie et mozilla . Donc en gros si tu veux faire un site avec les cotés ombrés donc backgroundé (désolé pour le therme) avec un design fluide et bien ca n'est pas possible . Je trouve ca dingue cela n'encourage donc pas à faire des design fluide qui déja été pénible à faire mais niveau boulot mais cela ne tenais qu'a nous, la on est limité par les naviguateur et donc meme si accepte de bosser plus on ne pourra pas . Il semblerai que la solution que j'avai trouvé n'a pas été cité dans l'article je vais la rester afin de voir si ca marche effectivement et pouvoir en parler au final. Je sais que j'ai réussi puisque mon site http://mtdo.info/news.php (une des pages ou vous pouvez voir cela) à la même apparence sous les deux principaux naviguateur plus surement d'autres et est entierement fait en pourcentage et n'a pas le bug du bloc qui passe en dessous. Mais bon je pensais qu'il y avait une solution moins abracadabrantesque que ce que j'avais trouvé en cherchant tout seul. C'est vraiment attristant car on nous dis de ne pas utiliser de table (et bien sur je suis d'accord sur ce point) mais on dirait que certaine situation comme la mienne ne nous laisse pas le choix ...
Rebonjour ,

Bon bah voila j'ai résolu mon problème à ma facon bien que je n'en soit pas très satisfait puisque le mini dépassement de firefox est toujours à divers moment du redimenssionement mais ca ne se voit presque pas et il est clairement impossible de faire autrement. Du coté de ie plus de bug . Pourquoi ?

c'est très simple ma structure est :

corps <-- width: 99.99%;
conteneur <-- width: 95 %; mais comme ca #corps #conteneur
gauche <-- foat: left; width: 75%; padding-left: 5%;
/gauche
droite <-- float: left; width: 19.89 %;
/droite
/conteneur
/corps

Voila ca marche à peu près bien comme ca mais si quelqun à une meilleur solutino je l'écoute les oreilles très très grandes ouvertes Smiley cligne

Merci a+
Bon apparence similaire dans toutes les résolutions dans :

Mozilla ancienne version : http://my.computer.is.free.fr/images/mozillaoldversion.png

Mozilla nouvelle version : http://my.computer.is.free.fr/images/mozillaoldversion.png

Internet Explorer : http://my.computer.is.free.fr/images/internetexplorer.jpg

Opéra :
http://my.computer.is.free.fr/images/opera.png

Konkeror :
http://my.computer.is.free.fr/images/konkeror.png

Safari :
http://my.computer.is.free.fr/images/safari.jpg

Reste encore ce header en table Smiley decu

Merci a+
Sujet clos
Aller à