CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:  Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! | |  L 
{ Membre actif }
 Messages : 867
 | Bonjour ! Et bien, voilà. Je vais d'abords soumettre le code et expliquer par la suite. - Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <div style="margin: auto; background:URL(http://hitskin.com/themes/14/96/93/i_background.png); border-top: 8px solid #942B2B; border-bottom: 8px solid #942B2B; border-left: 1px solid #942B2B; border-right: 1px solid #942B2B; border-radius: 70px; padding: 10px; color: #9a9a9a; font-family: trebuchet; font-size: 11px; text-align: justify;"> <span style="display: block; text-align: center; font-size: 32px; font-family: georgia; letter-spacing: 2px; font-style: italic; color: black; text-shadow: 0px 0px 5px #000000;">Le Renouveau de l'Eternité</span> <div style="display: block; background-color: #3e3e3e; margin: auto; padding: 20px; box-shadow: 2px 2px 3px #000000; box-shadow: 2px 2px 3px #000000; font-family: georgia; letter-spacing: 1px; font-size: 11px; text-align: justify; font-style: italic; border-bottom-left-radius: 50px 75px; border-bottom-right-radius: 50px 75px; border-top: 5px solid black;"> Hacque adfabilitate confisus cum eade postridie feceris, ut incognitus haerebis et repentinus, hortatore illo hesterno clientes numerando, qui sis vel unde venias diutius ambigente agnitus vero tandem et adscitus in amicitiam si te salutandi adsiduitati dederis triennio indiscretus et per tot dierum defueris tempus, reverteris ad paria perferenda, nec ubi esses interrogatus et quo tandem miser discesseris, aetatem omnem frustra in stipite conteres summittendo. </div></span></div> J'aimerai que le "Renouveau..." se superpose sur le cadre en dessous, car il prend énormément de place en haut, tout seul. Serait-il possible de m'aider ? De plus, j'ai remarqué que mon code ne se met pas sur toute la largeur d'un message, il s'arrête comme on dirait à une limite "verticale" des boutons éditer, citer et autres... Merci d'avance =). | | |
|  | | Doare 
{ Spécialiste }
 Messages : 544
| Bonjour. Tout d'abord, ceci n'a rien à faire là : - Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> Ensuite je ne comprends pas bien comment tu veux placer le span "Renouveau"... Remarque à part, dans les posts, les espaces et sauts à la ligne sont pris en compte. Pour voir régler correctement des marges, paddings, positionnements et compagnie, il faut s'en débarasser Par exemple en mettant les espaces/indentations concernées en commentaires : - Code:
-
<div style="margin: auto; background:URL(http://hitskin.com/themes/14/96/93/i_background.png); border-top: 8px solid #942B2B; border-bottom: 8px solid #942B2B; border-left: 1px solid #942B2B; border-right: 1px solid #942B2B; border-radius: 70px; padding: 10px; color: #9a9a9a; font-family: trebuchet; font-size: 11px; text-align: justify;"><!-- --><span style="display: block; text-align: center; font-size: 32px; font-family: georgia; letter-spacing: 2px; font-style: italic; color: black; text-shadow: 0px 0px 5px #000000;">Le Renouveau de l'Eternité</span><!-- --><div style="display: block; background-color: #3e3e3e; margin: auto; padding: 20px; box-shadow: 2px 2px 3px #000000; box-shadow: 2px 2px 3px #000000; font-family: georgia; letter-spacing: 1px; font-size: 11px; text-align: justify; font-style: italic; border-bottom-left-radius: 50px 75px; border-bottom-right-radius: 50px 75px; border-top: 5px solid black;"><!-- -->Hacque adfabilitate confisus cum eade postridie feceris, ut incognitus haerebis et repentinus, hortatore illo hesterno clientes numerando, qui sis vel unde venias diutius ambigente agnitus vero tandem et adscitus in amicitiam si te salutandi adsiduitati dederis triennio indiscretus et per tot dierum defueris tempus, reverteris ad paria perferenda, nec ubi esses interrogatus et quo tandem miser discesseris, aetatem omnem frustra in stipite conteres summittendo.<!-- --></div><!-- --></div> Tu avais au passage un </span> en trop à la fin. Autrement, si ce schéma doit être réutilisé plus d'une fois sur ton forum, utilise des classes et passe tout le CSS dans la feuille de style : ce sera beaucoup plus propre. Pour le 3e problème, il nous faudrait un lien vers un test sur ton forum. | | |
| | | | L
{ Membre actif }
Messages : 867
| Tiens, je pensais que le passage que tu trouvais inutile devait se placer à chaque code, ce n'est pas le cas ? Ensuite, je me suis sans doute mal exprimé. Je voudrais que le "Renouveau" soit placé par dessus le cadre, là où il y a la bordure noire. Que ça le chevauche en quelque sorte  . Et le problème avec ladite "limite" semble être réglée ! =). De plus, je ne peux pas placer le code dans la feuille de style. C'est un code pour une fiche d'écrit RPG, que j'aimerai utiliser sur plusieurs forums où j'en fais. | | |
| | | | Doare
{ Spécialiste }
Messages : 544
| Le passage en question est le début tronqué d'une page HTML. Tu ne crées pas une page HTML, tu n'en as pas besoin. Si tu devais créer une page HTML de zéro, Il te faudrait effectivement déclarer la doctype, ouvrir une balise html, déclarer le head, puis le body, et fermer la balise html : - Code:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- déclarations dédiées au navigateur : encodage, lien vers javascript, css, titre de la page, etc. -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<!-- contenu de la page -->
</body>
</html> Dans ce que je t'ai donné, l'espace pris est déjà bien moindre. Tu peux néanmoins : - ajouter position:relative; à la div parente ; - ajouter position:absolute; au span, une largeur de 100%, puis les propriétés top:0; et left:0;. - ajouter une marge haute à la div suivante pour ajouter de l'espace entre elle et le bord haut Modifie la marge et la valeur de top à ta guise... | | |
| | | | L
{ Membre actif }
Messages : 867
| Hum...
Le problème est donc réglé ! Je te remercie Doare ! =). | | |
| | | | pamina
{ Membre actif }
Messages : 1170
| Si le problème est réglé... alors, j'archive.  Merci de l'avoir signalé. | | |
| | | | Contenu sponsorisé
| | | | | |
Sujets similaires | |
|
| | Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|
