| (problème) cadre non centrer. | |
|
Kyou
{ Membre }
Messages : 164
| Alors bonsoir à tous. J'aurais besoin de votre aide, car ça fait très longtemps que je n'ai pas coder, et lorsque je m'y remets, j'ai un soucie de codage. Je n'ai pas mis center, mais même lorsque je le mets, un seul cadre centre, et non l'autre, il reste toujours sur le côté de l'autre cadre qui au-dessus de lui. J'aimerai savoir comment centrer l'autre aussi pour qu'il soit au centre du premier cadre qui est au-dessus de lui. - Spoiler:
- Code:
-
<div style="background-image: url('http://nsa29.casimages.com/img/2013/01/15/130115100243776479.jpg'); width:430px; border-radius: 50px 50px 50px 50px; border-top: 3px solid black; border-bottom: 3px solid black;"><div style="background-color:black; border-radius:50px 50px 50px 50px; width: 390px; margin-bottom: 10px; margin-top: 10px; padding: 20px; letter-spacing:-1px; text-align:justify; color: white;">xxxxxxxxxxxxxxx</div></div>
| | |
|
| |
Espeon
Administrateur
Messages : 1819
| Bonjour Kyou ! Je pense que ce tutoriel te sera utile du coup si j'ai bien compris ce que tu souhaites faire Pour info, c'est visiblement le texte que tu veux centrer dans le deuxième cadre (puisque le cadre en soit fait 430px de largeur au total, comme celui qui le contient). Pour cela, il faut changer la propriété text-align: justify par la valeur center (le texte sera centré dans le bloc). Enfin, je te conseille de séparer le CSS du HTML. Au lieu d'avoir <div style="blablabla"> c'est mieux d'avoir simplement <div class="ma-classe"> et de créer dans la feuille de CSS de ton forum : - Code:
-
.ma-classe { blablabla... } | | |
|
| |
Kyou
{ Membre }
Messages : 164
| Je veux qu'en gros, que mes deux cadres soient centrer, et non le texte. Je vais te montrer un exemple : modèle. tu vois le cadre 1 et centrer au milieu du cadre 2 dans le modèle. | | |
|
| |
Espeon
Administrateur
Messages : 1819
| Tout d'abord, je ne vois pas de quel cadre tu parle avec ton lien : il y a tout plein d'éléments sur ta page, soit plus explicite s'il te plait Sinon, tu peux centrer tant que tu veux ton deuxième cadre dans le premier mais il s'avère que les 2 cadres ont visiblement la même largeur... Prend 2 boites de même largeur et essaye de placer la première boite au centre de la deuxième et tu verra vite d'où vient ton problème ^_^ Ah et, juste pour être sûr, la largeur du cadre se calcule avec width + padding-left + padding-right (et on rajoute également les margins si tu veux la place globale qu'il prend). Ton premier cadre fait 430px de largeur et le deuxième fait 390 + 20 + 20 = 430px également P.S: Mais tout cela je te l'ai déjà expliqué dans mon premier message qui contient tout ce qu'il faut pour résoudre ton problème et même plus | | |
|
| |
Kyou
{ Membre }
Messages : 164
| Je te montre, mon problème en image : maintenant : https://nsa29.casimages.com/img/2013/01/17/130117061157293354.png
ce que je veux : https://nsa29.casimages.com/img/2013/01/17/130117061324434640.png
est-ce que tu comprends ce que je te demande, maintenant. | | |
|
| |
Espeon
Administrateur
Messages : 1819
| Oui oui d'accord, l'exotisme réside dans le fait que c'est le premier cadre que tu souhaites centrer sous le deuxième, mais mes explications restent les mêmes à savoir pour commencer : - Nettoie le CSS de ton HTML pour que ce soit plus lisible (si tu ne comprends toujours pas de quoi je parle sur ce point dis le moi)
- Sers-toi du tutoriel dont je t'ai donné le lien pour centrer le bloc du dessous déjà, c'est une bonne base
- Fais en sorte que les 2 blocs n'aient pas la même taille sinon l'effet ne sera pas probant/celui désiré
Une fois que tu auras fait ça, tu devrait avoir tes deux blocs centrés mais pas tout à fait comme tu le souhaites (vu que le bloc du dessus commencera toujours au même endroit que son conteneur). Pour régler ce dernier détail c'est pas très compliqué vu que tu fixe les tailles de tes blocs : tu calcule la différence de largeur entre tes deux blocs, tu divise cette valeur par 2 et tu applique un margin-left: (DIFFERENCE DE LARGEUR / 2); au bloc supérieur, ça te donnera le résultat escompté à savoir par exemple : | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Hello,
Ça ne serait pas plus "propre" de créer un décalage relatif ? '_' (Les marges négatives c'est le mal) | | |
|
| |
Espeon
Administrateur
Messages : 1819
| Tout à fait exact. Pour la dernière étape, oublie le margin-left et remplace-le par position: relative; suivi de left: (DIFFERENCE DE LARGEUR / 2); . Comme le dit 'Christa, c'est bien plus propre | | |
|
| |
Kyou
{ Membre }
Messages : 164
| D'accord, je vais essayer ça de suite. Je vous tiens au courant. Au faite, si je ne peux pas le mettre en "css" c'est que ce n'est pas sur mon forum que je compte le mettre.
| | |
|
| |
Espeon
Administrateur
Messages : 1819
| Dans ce cas c'est effectivement légitime, rien à redire J'attends donc de tes nouvelles pour savoir si tu t'en es sortie avec le code (ou non) | | |
|
| |
Kyou
{ Membre }
Messages : 164
| Oh est-ce que je peux poser une question ici, mais qui a un autre rapport avec un css, pour ne pas utiliser un autre sujet. J'aimerai savoir comment on fait pour qu'au passage les lettres s'écartent petit à petit comme ce forum : http://www.bazzart.org/ | | |
|
| |
Espeon
Administrateur
Messages : 1819
| Ce code t'explique quelle propriété changer et ce tutoriel (même s'il n'a pas encore été repris pour être plus pédagogique, il reste assez clair et concis) t'explique comment appliquer une transition sur un effet (= que cet effet se fasse petit à petit et pas d'un coup). Normalement tu devrais t'en sortir avec ça J'attends des nouvelles de ton code ensuite aussi (histoire de rester sur le sujet initial ^_^) : tu t'en sors ? | | |
|
| |
Enceladus
{ Membre }
Messages : 10
| Juste pour dire (si je le puis) qu'on peut séparer html et css sur forumactif même si on n'est pas admin du forum. Pour un post, faire un petit fichier css, l'héberger et le mettre en haut du post avec ceci : - Code:
-
<link href="http://liendemonpetitfichier.css" rel="stylesheet" type="text/css" /> ne m'a jamais posé de problème. J'imagine qu'on peut généraliser cette pratique, non ? | | |
|
| |
Espeon
Administrateur
Messages : 1819
| Tout à fait Enceladus est c'est une bien meilleure pratique. Après c'est à Kyou de voir si elle peut/sait/veut héberger son fichier CSS ou non Notez d'ailleurs que en théorie, placer un <style type="text/css"> ou un <link /> dans un message (= en dehors du <head> de la page) n'est pas vraiment valide et que en théorie, dans ce cas là, il faudrait utiliser les attributs style="" (mais bon je comprends le besoin de recourir à une feuille externe et, en définitive, on peut dire que ça passe, mais c'est bien de le savoir). | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Mais (et c'est là que le bât blesse) il faut pouvoir héberger le fichier CSS de façon stable et c'est moins facile T_T J'ai demandé à FA s'ils pouvaient créer un système de gestion de feuilles de style tout comme ils ont créé un système de gestion de pages HTML et Javascript, mais le temps qu'ils mettent ça en place... | | |
|
| |
Enceladus
{ Membre }
Messages : 10
| Pour l'hébergement, j'utilisais archivehost par le passé, maintenant dropbox. Ce sont deux hébergeurs différents qui nécessitent tous les deux une inscription. Gratuitement, l'un offre un stockage de 200Mo, l'autre de 2Go (un peu plus en parrainant des gens... j'vous donne mon identifiant dropbox si vous êtes intéressé ? ). Ils ont le même point commun : quand on ré-héberge un fichier sans modifier son nom, son url ne change pas d'un caractère. C'est assez pratique. ^^' Je note ton info, Espeon, très intéressante... Les deux règles se contredisent presque, c'est drôle. | | |
|
| |
Kyou
{ Membre }
Messages : 164
| WOUAH, et non je ne sais pas faire ça ._. Je peux avoir tes identifiants, enfin je veux dire, que je veux bien (: | | |
|
| |
Espeon
Administrateur
Messages : 1819
| @Kyou : ce qu' Enceladus t'explique c'est qu'il peut te parrainer pour ouvrir un compte Dropbox, pas de te donner ses identifiants pour te connecter à sa place (c'est peut-être ce que tu voulais dire, mais je préfère éviter les quiprocos). Quoiqu'il en soit, ton problème est-il résolu/peut-on clore le sujet ? Si oui je t'invite à l'indiquer dans le titre du sujet pour faciliter le travail des modérateurs Kyou En ce qui concerne les détails de comment héberger ton CSS sur Dropbox et te faire parrainer par Enceladus, je vous laisse traiter ça par MP (ce sera plus approprié) | | |
|
| |
Psycho
Psychopathe
Messages : 3407
| Hello ! Je viens aux nouvelles : le sujet est-il toujours d'actualité ?Si nous n'avons pas de réponse dans 4 jours, il sera considéré comme résolu ! Merci de ta compréhension | | |
|
| |
Psycho
Psychopathe
Messages : 3407
| Yop ! N'ayant toujours pas obtenu de réponse, je considère ce sujet comme résolu ! Merci de ta compréhension | | |
|
| |
Contenu sponsorisé
| |
| |
| (problème) cadre non centrer. | |
|