[Résolu] [Html] Doctype : meilleur affichage sans !

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [Résolu] [Html] Doctype : meilleur affichage sans !

ultratoonz

Hello,

J'ai construit mon site sans doctype en le testant sur plusieurs navigateurs. L'affichage à toujours été satisfaisant, jusqu'à ce que... je rajoute un doctype !

index.html (bouton Accueil) et communication.html n'ont pas de doctype et j'ai la mise en page que je souhaite sous les dernières versions de Netscape, IE et Firefox. Les autres pages (en test : publication.html et prestations.html) ont un doctype et j'ai une mise en page vraiment différente entre IE et les autres navigateurs (trop d'espace dans mon texte).

Qu'est-ce que je fais, je supprime mes doctypes de toutes mes pages (qu'est-ce que je risque ?), ou il en existe un qui me donnera le même affichage quelque soit le navigateur ?
Thanx

Mon site est là
Tester avec un autre explorateur qu'IE bien sûr.

Message édité par ultratoonz le 04-03-2005 à 22:50:19

Publicité

esox_ch

Le doctype dit a ton navigateur comment il doit se comporter fasse a la page. Si tu as mal developpé ton site, il se peut effectivement que l'environnement "minimaliste" dans lequel entrent les navig quand il y a pas de doctype remarque moins les erreur qu'avec un doctype..

Cela dit c'est pas la faute du doctype ou du browser, c'est la tienne

---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait

ultratoonz

Pas de solution ?

Mjules

Parle dans le vide

si, corrige ton code

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

ultratoonz

Ben je n'arrive pas à obtenir le même affichage que sans doctype en "reprenant" mon code ! Toujours trop d'espace entre mes pseudos paragraphes / j'ai utilisé la mise en page de mon texte pour avoir moins d'interligne qu'avec le saut de ligne des changements de paragraphes (les vrais).

Comment faire ?

masklinn

í dag viðrar vel til loftárása

1- arrêter d'utiliser des tableaux pour la mise en page, leur préférer une mise en page en CSS
2- arrêter d'utiliser du flash ou du Javascript là ou ils n'ont pas à être utilisés, ici encore préférer l'utilisation des CSS
3- user et abuser du validateur HTML/XHTML du W3C ainsi que des docs de références des normes

Erreurs repérées:
<embed> n'existe pas
boutons en flash
rollovers en javascript (aucun intérêt)
son (figure dans les pires trucs trouvables sur un site web)
tagging HTML mal foutu (utilisation de classes là où il faudrait utiliser des ids, tags <span> ou <div> nestés inutiles, ...)

En fait, commencer par arrêter de développer le site sous Dreamweaver

Message édité par masklinn le 04-03-2005 à 18:27:42

---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box by throwing away the limits imposed by overbearing genetic regulations? Isn't that a good thing?

Mjules

Parle dans le vide

quel intérêt de mettre ton texte dans un tableau ? tu perds complètement la sémantique, tes titres ne signifient plus rien sans style.

pourquoi tu ne mets pas tes titres dans des blaises de titre et tes paragraphes dans des p et ensuite tu styles le tout ?

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

gm_superstar

Appelez-moi Super

ultratoonz a écrit :

règle les marges de tes paragraphes...

Enfin ceci dit, il y a beaucoup trop de tableaux dans cette page.

C'est tellement plus simple d'avoir une succession de :

<h1>...</h1>
<p>...</p>
<h1>...</h1>
<p>...</p>
<h1>...</h1>
<p>...</p>

[:benou_grilled]

Message édité par gm_superstar le 04-03-2005 à 18:26:21

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

ultratoonz

Je les utilise essentiellement pour avoir plus de souplesse dans la mise en page de mon texte. Pas pour la mise en page des autres blocs, qui eux sont en div.

Je ne connais pas de solution pour personnaliser l'interligne, donc en attendant... (j'avais déjà poster pour ça et j'ai jamais eu de réponse) ---> tableaux

Mjules

Parle dans le vide

padding et margin pour l'espacement dans et hors des paragraphes/titres
line-height pour l'interligne

Message édité par Mjules le 04-03-2005 à 18:29:00

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

Publicité

masklinn

í dag viðrar vel til loftárása

qu'appelles tu l'interligne?
l'espace entre deux paragraphes?

ultratoonz

Oui, saut de ligne en général : l'espace entre deux lignes.

masklinn

í dag viðrar vel til loftárása

ultratoonz a écrit :

Oui, saut de ligne en général : l'espace entre deux lignes.

[:fing fang fung]
Ok, ça aide beaucoup...
Enfin bon, mjules a répondu de toute façon

ultratoonz

Vais essayer line-height, ça a l'air de pouvoir résoudre mon problème.

Quel doctype me conseillez-vous ?

ultratoonz

Avant que je teste ! ;-)

TriadPtale

http://pompage.net/pompe/declarations/

masklinn

í dag viðrar vel til loftárása

HTML 4.01 strict ou XHTML 1.0 strict.

Habituellement j'utilise XHTML 1.0 strict mais il est un poil plus difficile à mettre en oeuvre que HTML 4.01 sans apporter grand chose, donc un doctype HTML est largement suffisant pour commencer.

ultratoonz

Je bosse dessus. Pouvez-vous me dire s'il est possible d'avoir deux interlignes (espaces) différents pour un paragraphe.

Je m'explique : je voudrai que mon titre ai un espace de 12 pts avec le paragraphe qui le suit, et un espace plus important (genre 14 pts) avec celui qui le précède. Possible ?

Mjules

Parle dans le vide

joue avec la marge de ton h (margin-top et margin-bottom) et/ou avec les marges hautes et basses des paragraphes

Message édité par Mjules le 04-03-2005 à 20:55:59

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

ultratoonz

Ben le padding c'est pas pour l'espace horizontal par rapport à la bordure du bloc ?

gm_superstar

Appelez-moi Super

gm_superstar a écrit :

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

ultratoonz

gm_superstar a écrit :

Je m'y emploie, je m'y emploie (tant mieux si j'arrive à me débarasser de la technique des tableaux)....

Mjules

Parle dans le vide

ultratoonz a écrit :

Ben le padding c'est pas pour l'espace horizontal par rapport à la bordure du bloc ?

le padding c'est l'espace intérieur dans le bloc (dans toutes les directions), la marge c'est l'espace à l'extérieur du bloc.
http://openweb.eu.org/articles/dimensions_boites_css/

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

ultratoonz

Merci Mjules, mais je n'ai pas besoin du padding pour personnaliser mes interlignages puisque le padding sert à positionner mon bloc de texte dans le div, et non à positionner mes paragraphes individuellement. Thanx anyway. J'avance...

masklinn

í dag viðrar vel til loftárása

ultratoonz a écrit :

[:fing fang fung]

pardon?

ultratoonz

Je peux mettre un padding dans mes styles de paragraphes ?

masklinn

í dag viðrar vel til loftárása

pourquoi pas?

tu fais ce que tu veux [:spamafote]
tu peux même mettre des bordures aux paragraphes

Mjules

Parle dans le vide

masklinn a écrit :

[:fing fang fung]

pardon?

j'ai fait une faute de frappe dans une de mes réponse (padding en lieu et place de margin) et il a pas du voir que j'avais édité

---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. | Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.

masklinn

í dag viðrar vel til loftárása

Mjules a écrit :

j'ai fait une faute de frappe dans une de mes réponse (padding en lieu et place de margin) et il a pas du voir que j'avais édité

Ce qui n'empêche pas de jouer avec le padding pour les interpositionnement des paragraphes, après ça dépend des effets visuels qu'on peut vouloir générer (par exemple des fonds qui "se touchent" sans interruption)

ultratoonz

Mes titres de paragraphes sont le style 7 dans ma css.
Mes paragraphes sont le style 3 dans ma css.

Je veux que "Free Lance" (en style 7 donc) soit plus près du paragraphe qui le suit, que du paragraphe qui le précède.

Je fais des essais mais je n'arrive pas à utiliser padding pour le "rapprocher" du paragraphe qui le suit.

J'arrive quelque peu à mes fins en "trichant" : je crée un style de paragraphe différent que j'intercale en faisant un saut de ligne avant "Freelance". Mais c'est vraiment du bricolage, et je n'ai pas un résultat qui me convient parfaitement.

Pouvez-vous me donner un exemple d'utilisation du padding dans la css pour mon style 7, le titre "Freelance" ? Ce padding rapprocherait le titre du paragraphe suivant.

gm_superstar

Appelez-moi Super

On s'en fout du padding. Je répète, parce que visiblement ça passe pas...

gm_superstar a écrit :

règle les marges de tes paragraphes...

Enfin ceci dit, il y a beaucoup trop de tableaux dans cette page.

C'est tellement plus simple d'avoir une succession de :

<h1>...</h1>
<p>...</p>
<h1>...</h1>
<p>...</p>
<h1>...</h1>
<p>...</p>

[:benou_grilled]

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

ultratoonz

Ok Super, mais comment je définis <h1> pour que le titre soit plus près du paragraphe qui le suit que de celui qui est avant ?

gm_superstar

Appelez-moi Super

h1 {
margin: 10px 0px 4px 0px;
}

par exemple. Cf http://www.yoyodesign.org/doc/w3c/ [...] properties

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog

ultratoonz

Citation :

.titre {
color: #FFFFFF;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin-bottom:15px;
margin-top:5px;
}
.paragraphe {
color: #FF9933;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}

Ben voilà, moi qui croyait que la balise margin ne s'appliquait qu'aux calques. Ca a résolu mon problème. Merci à Masklinn, Mjules et Super pour votre aide sur mon problème d'interlignage. Merci de vous être accrochés ! lol

Bon ben j'ai un peu de planche sous le pain... @+

masklinn

í dag viðrar vel til loftárása

ultratoonz a écrit :

Ben voilà, moi qui croyait que la balise margin ne s'appliquait qu'aux calques. Ca a résolu mon problème.

Ce qui prouve encore une fois que Dreamweaver est un instrument du démon et devrait être interdit [:natas]

En HTML/XHTML (et donc modifiable via CSS), tout élément quel qu'il soit possède une marge, une bordure et un padding (dans les 4 directions) ainsi qu'un positionnement (normal, absolut, relatif ou fixe) et une taille.

Ensuite en fonction du type d'affichage (block, inline, ...) ces attributs peuvent être appliqués différement voir pas du tout, mais ils existent toujours

ultratoonz

Thanx pour la précision Masklinn. Néanmoins je ne partage pas tout à fait ton extrémisme. Sans Dreamweaver et son mode mixte (affichage simultané code & créa), je n'aurai jamais eu envie de mettre les mains dans le code, même si le html est un des langages les plus simples.

Quand on est un peu réfractaire à la prog,grâce au wysiwyg, on peut apprendre un langage parfois plus facilement. Je te concède en outre que c'est parfois plus laborieux que si l'on apprend le code de façon académique.

Enfin, pour moi qui suis plus designer que webmaster, Dream m'a donné envie d'apprendre le code.

Publicité

FORUM HardWare.fr

Programmation

HTML/CSS

[Résolu] [Html] Doctype : meilleur affichage sans !

Sujets relatifs
Différence d'affichage entre IE et Firefox avec du XHTML strict	[Résolu] Resample d'image anti aliasé => interpolation BICUBIC
Lecteur média player dans page HTML	Mettre en forme de l'html généré par PHP [resolu(tu m'étonnes :p)]
[Conseils]Mise en page contenant plein d'élément gif avec CSS ou HTML	[Resolu][CSS] Pb avec @font-face
[html] Pourquoi c'est pas la même font ?	affichage d'une appli Flash sous Firefox
[resolu]petit pb de structures...
Plus de sujets relatifs à : [Résolu] [Html] Doctype : meilleur affichage sans !

Page générée en 0.130 secondes