28173 sujets

CSS et mise en forme, CSS3

Bonjour!

Je suis en train de construire une application web pour une grosse compagnie Canadienne que je dois taire le nom par sécurité Smiley cligne

J'ai un div qui s'appelle Code qui est défini ainsi dans mon fichier CSS:


.code {
	font-family: monospace;
	border: 1px solid #CCCCCC;
	border-left: 8px solid #D1D7DC;
	color: #339900;
	font-family: "Courier New", Courier, mono;
	font-size: 90%;
	padding: 0.5em 1em;
	margin: 1em 0.5em;
	background: #F5F5F5;
	width: 570px;
	overflow: auto;
}


Cependant, lorsque le code dépasse vers la gauche, il met 2 barres (une horizontale et une verticale), ce qui est inutile car il va toujours y avoir la bonne hauteur pour la longueur. J'aimerais donc qu'il n'y ai que la barre horizontale qui s'affiche lorsque le texte dépasse à gauche. J'ai cherché sur le web et je n'ai pas trouvé et la propriété overflow ne semble pas gérer ce détail! Ah, en passant, c'est fait pour rouler sous IE (hey oui tout le monde utilise ça alors il faut faire avec hehe)

En espérant être asser claire, je vous souhaite une bonne journée et j'attend vos réponses Smiley ravi

Jaff
the_penguin a écrit :
ne serait-il pas plus judicieux d'utiliser la balise <code> ?


Peut-être! Comme je disais, je ne sais pas comment le faire alors toute les solutions sont bonnes! Que proposes-tu?

Merci!
the_penguin a écrit :
La balise code ne résoudra pas de problème d'affichage mais un problème de sémantique.


Peux-tu m'expliquer avec un exemple? Je ne suis pas certain de comprendre ce que tu m'expliques... Je ne crois pas avoir le choix d'utiliser un div ca ce code est généré automatiquement à l'aide d'un éditeur de texte (FCKEditor) et code est en fait un Style appliqué à du texte. Tout va très bien à par mon problème de scroll!

J'attend ta réponse!
the_penguin a écrit :
La balise code ne résoudra pas de problème d'affichage mais un problème de sémantique.

Utiliser un élément code (élément de type en-ligne) ou bien plutôt pre (élément de type bloc) ? Je pencherais plutôt pour la deuxième solution.

La sémantique web, c'est le fait de faire passer une information non pas uniquement à travers un habillage visuel, mais à travers le code lui-même, en utilisant les éléments les plus adaptés. Ainsi, pour passer l'information « Ceci est du code », les éléments code et pre sont plus adaptés qu'une simple div, qui est un élément de type bloc sans signification particulière, à part le fait que c'est un conteneur neutre…

À quoi ça sert ?

– Lorsque la feuille de style est désactivée, la structure du site/du document est toujours compréhensible. Un bon site doit être utilisable avec une feuille de style désactivée.
– Question d'accessibilité : les navigateurs en mode texte, les lecteurs d'écran, les terminaux portables n'utilisent pas du tout – ou alors juste en partie, pour certains terminaux portables – les informations de style. Si le contenu n'est pas bien organisé balisé, donc pas compréhensible sans l'habillage graphique, il ne sera pas accessible pour tous ça.
– Pour le Web sémantique : les différents systèmes d'indexation/analyse de contenu qui ont besoin de « comprendre » la structure du contenu, ou certaines informations, ce qui nécessite que ces informations soient présentes dans le code de manière standardisée.

Plus d'exemples sur le web sémantique si la demande est forte. Smiley smile
Bon... J'avais pensé à utiliser pre, le problème est que mon éditeur de texte en ligne (FCKEditor) ne fonctionne pas de cette façon. Il doit créer des Div ou des Span à l'aide d'un fichie XML.

De plus, c'est pour un site interne utilisable seulement sur IE. 95% du monde qui vont l'utiliser ne save même pas ce qu'est un navigateur texte... Et le site ne roulera JAMAIS sans CSS et si c'était le cas, mon équipe serait appelé sur le champs afin de régler le problème dans les plus bref délai.

Moi tout ce que je veux savoir c'est si c'est possible de contrôler les Scroll bar en CSS!

Merci!
Avec Internet Explorer, il doit y avoir moyen de gérer ça avec les propriétés overflow-x et overflow-y.