28158 sujets

CSS et mise en forme, CSS3

Bonjour.

Je suis en train de travailler sur le site d'un de mes potes et j'aiq uelques problèmes avec la Iframe.

En effet, quand il n,y a pas besoin d'avoir de scrollbars, tout passe nickel, mais quand la scrollbar verticale apparaît, il y en a une horizontale qui apparaît également mais qui n,est pas nécessaire parce que le contenu ne prend pas plus que la largeur de l'iframe.

J'ai essayé de supprimer les marges et les "paddings", mais sans succès.

L'adresse du site : http://js.fusionxhost.com/gim/index.html

Quelqu'un peut m'éclairer?
Merci d'avance.
iframe c'est obselète: le gros problème viendra du référencement.
En effet que se passe t'il si un visiteur entre par google en cliquant (par ex):
http://js.fusionxhost.com/gim/licence_pro/partenaires.html
...ben oué, t'as plus de menu et ta page est incompréhensible...

Utilises plutôt la propriété css "overflow" et intègre ton contenu dans ton gabarit. Je te laisse fouiller pour la suite.

Salut
je complète ma réponse avec un exemple.

css:

#mon_bloc {
  display: block;
  width: 200px;
  height: 200px;
  overflow: scroll;    /* ou "auto" */
}


html:

<div id="mon_bloc">
  Si meliora dies, ut vina, poemata reddit, scire velim, chartis pretium quotus arroget annus. scriptor abhinc annos centum qui decidit, inter perfectos veteresque referri debet an inter vilis atque novos? Excludat iurgia finis, "Est vetus atque probus, centum qui perficit annos." Quid, qui deperiit minor uno mense vel anno, inter quos referendus erit? Veteresne poetas, an quos et praesens et postera respuat aetas?
"Iste quidem veteres inter ponetur honeste, qui vel mense brevi vel toto est iunior anno." Utor permisso, caudaeque pilos ut equinae paulatim vello unum, demo etiam unum, dum cadat elusus ratione ruentis acervi, qui redit in fastos et virtutem aestimat annis miraturque nihil nisi quod Libitina sacravit. 
Ennius et sapines et fortis et alter Homerus, ut critici dicunt, leviter curare videtur, quo promissa cadant et somnia Pythagorea. Naevius in manibus non est et mentibus haeret paene recens? Adeo sanctum est vetus omne poema. ambigitur quotiens, uter utro sit prior, aufert Pacuvius docti famam senis
</div>


Faudra faire attention à ce que tu mets dans ton div, si la barre de scroll horizontale apparait c'est que t'as un margin ou un padding qui pousse le div.
brunob a écrit :
iframe c'est obselète

Les frames et iframes ne sont absolument pas obsolètes. Ils font toujours partie des spécifications HTML 4 et XHTML 1.0, et utilisables :
- avec un Doctype Frameset pour les frames ;
- avec un Doctype Transitional pour les iframes.

Ils posent par contre des problèmes assez lourds pour l'accessibilité et le référencement, voire dans certains cas l'ergonomie, et peuvent être remplacés -- pour certains usages -- par d'autres techniques.

Le fait d'être problématique pour l'accessibilité et le référencement ne signifie pas qu'une technique soit obsolète. Si c'était le cas, de nombreuses utilisations mal avisées des feuilles de style CSS seraient frappées du même sceau. Smiley cligne

brunob a écrit :
Utilises plutôt la propriété css "overflow" et intègre ton contenu dans ton gabarit.

Non, ça n'est pas mieux.

Il est très largement préférable d'éviter autant que possible d'avoir des barres de défilement interne sur une page. Avec un bloc en hauteur fixe et doté d'un overflow: auto, on a aussi notre lot de problèmes d'accessibilité et d'ergonomie (mais pas de référencement, certes). À éviter.

Les navigateurs web sont dotés d'une chose absolument fabuleuse nommée « barre de défilement ». Penser à l'utiliser ne peut pas faire de mal. Smiley ravi
brunob a écrit :
Obselète or not?
si tu joues sur les mots ok avec toi ca ne l'est pas Smiley smile

Il ne s'agit pas de jouer avec les mots, mais d'être précis. Dire que les iframes sont obsolètes revient à dire qu'il ne faut plus les utiliser. Ce qui est faux : rien n'interdit de les utiliser, et il peut être utile de le faire à l'occasion.

Ce qui est important, c'est de connaitre les contraintes liées aux différentes options disponibles, ce qui permet de faire un choix éclairé par la suite.