28220 sujets

CSS et mise en forme, CSS3

Bonjour les amis!

Je fais les tutorials qui m'intéresse pour ajouter des éléments à mon site web.

J'ai essayer celui des boîtes avec les dl,dt,dd.

Avec IE tout est super beau, avec firefox, ce n'est pas tout à fait correct.

Pouvez-vous me dire pourquoi? Je pense que le problème est cerner dans le margin que je mets pour descendre le titre un peu.

Voici l'exemple: exemple avec le tutoriel
Modifié par Daok (14 Aug 2005 - 02:07)
hola Smiley confus

Il manque plusieurs éléments ici pour avoir un document HTML.

Tout d'abbord, l'élément <html> lui-même.
Puis l'élément <head> dans lequel logeront les déclarations de <style>.
Sans oublier qu'il faut un DOCTYPE tout en haut.

Bref, avant de demander assistance, assure-toi de fournir un code complet et conforme.

--
Stephan

<edit />
Tiens donc ! Ce n'est pas ta première offense :
http://forum.alsacreations.com/topic.php?fid=4&tid=5924&p=1#p52922
Modifié par Stephan (11 Aug 2005 - 02:08)
Oh my god

Je m'en vais d'ici Les gens qui ne veulent pas aider pourquoi est-ce que vous êtes sur les forums? En anglais les gens sont pas aussi compliqué et en y repensant meme en francais dans les autres forums...

Premièrement, je ne demande pas de code je veux juste savoir c'est quoi mon erreur dans une partie de mon code que j'ai séparer dans un fichier html pour que vous voyer le moins de code posssible (mois de 50 lignes tirés de vos tutoriels)

Mon Dieu, exuser mes pêchés, lorsque je viens sur alsacréation le monde nous regarde de bien trop haut. Come on, relaxer un peu les gars, j'ai rien offensé, en plus c'est un de vos tutoriels de ce site que je demande de l'aide....et je suis polie.... what ever, les premiers seront les derniers comme on dit, j'aurais pu vous aidez dans d'autre domaine que les CSS un jour qui sait...
Hé ! On fait que ça essayer de t'aider mais tu ne veux rien entendre Smiley fache

Voilà le code que tu nous présentes avec ton lien :

<style type="text/css">
body{background-color: #FFFFCC;text-align: center;}

dl{
position:absolute;
left:0px;
top:0px;
width:304px;
}

dl,dt,dd{
margin:0;
padding:0;
}

dl{
background:url(af_accueil_03.png) bottom left no-repeat; 
padding-bottom:7px;
}

dt{
height:30px;
background:url(af_accueil_01.png) top left no-repeat;
font-size:0.8em;
margin:5px 0 0px 0 ;		/*Descend le titre*/
padding:5px;
text-align:center;
font-weight:bold;
}

dd{
padding:0 20px 0 10px;
text-align:justify;
background:url(af_accueil_02.png);
}

</style>
<body>
<div>
<dl>
	<dt>Mon titre qui est trop long pour l'espace</dt>
	<dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin porta, consectetuer adipiscing elit. Proin porta, odiconsectetuer adipiscing elit. Proin porta, odi odio ut sodales laoreet, orci tellus gravida risus, eget malesuada.</dd>
	<dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin porta, consectetuer adipisc</dd>
	<dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin porta, consectetuer adipisc</dd>

</dl>	
</div>
</body>

Et moi je te dis qu'il manque :
Stephan a écrit :

Tout d'abbord, l'élément <html> lui-même.
Puis l'élément <head> dans lequel logeront les déclarations de <style>.
Sans oublier qu'il faut un DOCTYPE tout en haut.

Ces éléments sont obligatoires. Sans eux, on ne peut pas t'aider.
Concernant la DTD => Les DTD HTML4.01 et XHTML1.0 : comment choisir ?

On peut y lire :
Tutoriel a écrit :

Mais un document même valide et dénué de DTD posera un problème de rendu dans les navigateurs modernes, que nous allons examiner ci-dessous : le rendu CSS diffèrera en effet selon la présence ou non d'une DTD, en raison du mécanisme du "doctype switching".

Ceci dit, si tu n'aimes pas ce forum, passe ton chemin.
Modifié par Stephan (12 Aug 2005 - 04:51)
Bonjour,

Daok a écrit :
Je m'en vais d'ici Les gens qui ne veulent pas aider pourquoi est-ce que vous êtes sur les forums?


Au contraire, Stephan t'a donné exactement la réponse qu'il fallait pour t'aider à résoudre ton problème de rendu.

Comme on te l'a déjà dit dans cet autre sujet, en travaillant avec un code invalide, tu t'en remets complètement au hasard, car chaque navigateur va traiter ta page en mode de gestion d'erreurs. Et chaque navigateur peut faire ce qu'il lui plaît dans ce mode.

Il ne servirait à rien de te donner une solution CSS, sans te faire corriger d'abord ces erreurs HTML.

Stephan t'a donné les indications pour le faire.

Et pour tout te dire, le rendu de ton exemple change complètement une fois le code HTML corrigé : Firefox et IE affichent alors le même résultat, et le problème CSS devient très facile à corriger à son tour Smiley cligne

Daok a écrit :
Mon Dieu, exuser mes pêchés, lorsque je viens sur alsacréation le monde nous regarde de bien trop haut.


Non, pas du tout. Tu poses une question parce que tu as un problème. Nous t'expliquons où est ton erreur, et comment résoudre ton problème.

Comme ce n'était pas la réponse que tu attendais, tu n'écoutes pas cette explication...

En outre, ce n'est pas la première fois que ta façon de faire suscite des problèmes ici (voir ton tout premier sujet).

Que pouvons-nous faire, sauf t'inviter à ne plus poser ici de questions qui ne te servent à rien, puisque tu ne tiens pas compte des réponses ? Et que tu nous font perdre un temps que nous pourrions consacrer à aider d'autres personnes...

Donc, c'est à toi de choisir :
- tenir compte des réponses et des explications données
- ou, effectivement, renoncer à demander de l'aide sur ce forum.
Modifié par Laurent Denis (12 Aug 2005 - 06:01)
Ok, je vais essayer de suivre TOUT vos conseils à la lettre question de voir si vous avez raison.

Pour les DTD, j'ai opté pour XHTML STRICT étant donnée que je veux être le plus stricte possible et que je ne veux pas de iframe. Je pense que j'ai bien choisie?

Par ailleur, j'ai toujours le même problème (surement parce que les DTD serve seulement à valider comme j'ai lu dans l'article que vous m'avez suggéré de lire). Néanmoins, maintenant je suis cette règle donc 1 pas vers l'avant.

Comme mon ami Stephan à dit, j'ai omis de mettre le HTML et le HEAD. Je l'ai ai mis. Mon problème n'est pas plus résolue mais c'est un 2e pas vers du code meilleur...

Pour Laurent bien j'ai suivi vos conseils, je pense que mon erreur est dans de DD et DT. J'essaye de changer les padding et les margin, mais lorsque je fixe pour IE, c'est FIREFOX qui fonctionne pu.