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! |
| Problème - Texte collé au bord d'une div ? | |
| CS-forum
{ Membre }
Messages : 34
| Bonjour, bonsoir ! Voici mon 'problème', l'image parle d'elle même :
Je souhaiterais espacer le texte des deux côtés (donc l'utilisation de la balise [*list] ne m'arrange pas puisqu'elle ne décale qu'un seul côté.) de manière harmonieuse. Voici mon code :
- Code:
-
<center><div style="width: 620px; -moz-border-radius: 10px 10px 20px 20px; background-color: #696969; margin-left: 0px; padding-left: 0px; padding-right: 0px;"><div style="width: 600px; -moz-border-radius: 0px 0px 0px 0px; background-image : url('http://img51.imageshack.us/img51/7973/cieln.jpg'); margin-left: 0px; padding-left: 0px; padding-right: 6px;"><div style="height:76px; width: 606px ; background-color: #696969; -moz-border-radius: 0px 0px 110px 110px;"><div style="height:70px; width: 600px ; background-color: #F8F8FF; -moz-border-radius: 0px 0px 220px 220px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=24]Invokers[/i][/size] [i][size=12]"Viens à moi, serviteur."[/i][/size]
</div></div></div> <div style="width: 510px ; background-color: #696969; -moz-border-radius: 5px 5px 5px 5px;"><span style="font-family: Georgia; color: #000000; letter-spacing: 2px; font-size: 14px;">[img]http://img836.imageshack.us/img836/9564/invokers.png[/img]</div>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Description[/size][/i] </div></div></div><center><div style="height:430px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px;"> [size=12][justify][font=Georgia][i] Faire voler en éclats la barrière de l'irréel par la force d'un simple mot ne relève assurément pas du surréalisme pour les Invokers. Leur parole gonfle, s'amplifie avant de se matérialiser sous la forme de la créature souhaitée. Là se dessinent les premières limites à la conception : cet animal se doit d'appartenir à la réalité. Faire surgir de nulle part un dragon, furie, phœnix ou autre chimère ne se situe manifestement pas dans les cordes d'un Invoker.
Une de ces invocations acquiert un statut tout particulier à ses yeux : la Doll. Plus vigoureuse, plus robuste que toutes celles se trouvant dans la palette de création de l'Invoker, elle se démarque non seulement de par cette puissance hors du commun, mais également du fait de la présence constante de sa personne aux côtés de son maître. La repérer se révèle rarement être une partie de difficulté : la Doll est en moyenne trois à quatre fois plus imposante que ses congénères animaux. Elle se trouve souvent être une créature des plus majestueuses : qui ne rêverait pas de détenir pour animal de compagnie un lion, un anaconda, ou encore un tigre lui obéissant au doigt et à l'œil ? Bien qu'il ne soit pas exclu de devenir l'heureux propriétaire d'un énorme castor ou bien d'une monstrueuse araignée, bien que cela ait pour effet de se révéler nettement moins imposant... Ces créatures extraordinaires sont des compagnons de choix : en plus d'être fondamentalement fidèles, et douées de paroles, elles disposent de l'immortalité. On murmure même que les Dolls de certains Invokers, parmi les plus expérimentés, possèdent quelques pouvoirs supplémentaires, telle l'autoregénération...
Difficile retour à la réalité : la magie fantastique des Invokers n'est pas sans limites. Lorsque celui-ci se trouve à bout de forces, car ces charmantes bestioles ont pour particularité de puiser sans retenue dans les réserves énergétiques de leur maître, telles d'horribles sangsues, il ne peut plus exercer sur elles la Laisse mentale. Dans l'optique où ceci se produirait, deux possibilités s'ouvrent à l'Invoker épuisé : soit la créature se contentera de retourner tranquillement à l'état de songe, ou bien, plus inconvenant, se retournera contre lui, et le fait de le blesser, ou pire, ne lui inspirera aucuns remords... [/font][/i][/justify][/size]</div></center>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Compétences[/size][/i] </div></div></div><center><div style="height:50px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px;"> [size=10][justify]• [u]Capacité raciale de Classe :[/u] Invocation. • [u]Capacité raciale Spéciale :[/u] Invocation & Dressage d'une Doll.[/justify][/size]</div> </center> </div></div></div> Je sais que je devrais simplifier tout ça avec le CSS mais ce n'est qu'un premier jet :'). Quelqu'un aurait-il la solution à mon problème ?
Merci d'avance ! |
Dernière édition par CS-forum le Dim 20 Fév 2011, 09:18, édité 1 fois | |
| | | Invité Invité
| Hop' Remplace tout ton code par celui ci : - Code:
-
<center><div style="width: 620px; -moz-border-radius: 10px 10px 20px 20px; background-color: #696969; margin-left: 0px; padding-left: 5px; padding-right: 5px;"><div style="width: 600px; -moz-border-radius: 0px 0px 0px 0px; background-image : url('http://img51.imageshack.us/img51/7973/cieln.jpg'); margin-left: 0px; padding-left: 0px; padding-right: 6px;"><div style="height:76px; width: 606px ; background-color: #696969; -moz-border-radius: 0px 0px 110px 110px;"><div style="height:70px; width: 600px ; background-color: #F8F8FF; -moz-border-radius: 0px 0px 220px 220px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=24]Invokers[/i][/size] [i][size=12]"Viens à moi, serviteur."[/i][/size]
</div></div></div> <div style="width: 510px ; background-color: #696969; -moz-border-radius: 5px 5px 5px 5px;"><span style="font-family: Georgia; color: #000000; letter-spacing: 2px; font-size: 14px;">[img]http://img836.imageshack.us/img836/9564/invokers.png[/img]</div>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Description[/size][/i] </div></div></div><center><div style="height:430px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px;"> [size=12][justify][font=Georgia][i] Faire voler en éclats la barrière de l'irréel par la force d'un simple mot ne relève assurément pas du surréalisme pour les Invokers. Leur parole gonfle, s'amplifie avant de se matérialiser sous la forme de la créature souhaitée. Là se dessinent les premières limites à la conception : cet animal se doit d'appartenir à la réalité. Faire surgir de nulle part un dragon, furie, phœnix ou autre chimère ne se situe manifestement pas dans les cordes d'un Invoker.
Une de ces invocations acquiert un statut tout particulier à ses yeux : la Doll. Plus vigoureuse, plus robuste que toutes celles se trouvant dans la palette de création de l'Invoker, elle se démarque non seulement de par cette puissance hors du commun, mais également du fait de la présence constante de sa personne aux côtés de son maître. La repérer se révèle rarement être une partie de difficulté : la Doll est en moyenne trois à quatre fois plus imposante que ses congénères animaux. Elle se trouve souvent être une créature des plus majestueuses : qui ne rêverait pas de détenir pour animal de compagnie un lion, un anaconda, ou encore un tigre lui obéissant au doigt et à l'œil ? Bien qu'il ne soit pas exclu de devenir l'heureux propriétaire d'un énorme castor ou bien d'une monstrueuse araignée, bien que cela ait pour effet de se révéler nettement moins imposant... Ces créatures extraordinaires sont des compagnons de choix : en plus d'être fondamentalement fidèles, et douées de paroles, elles disposent de l'immortalité. On murmure même que les Dolls de certains Invokers, parmi les plus expérimentés, possèdent quelques pouvoirs supplémentaires, telle l'autoregénération...
Difficile retour à la réalité : la magie fantastique des Invokers n'est pas sans limites. Lorsque celui-ci se trouve à bout de forces, car ces charmantes bestioles ont pour particularité de puiser sans retenue dans les réserves énergétiques de leur maître, telles d'horribles sangsues, il ne peut plus exercer sur elles la Laisse mentale. Dans l'optique où ceci se produirait, deux possibilités s'ouvrent à l'Invoker épuisé : soit la créature se contentera de retourner tranquillement à l'état de songe, ou bien, plus inconvenant, se retournera contre lui, et le fait de le blesser, ou pire, ne lui inspirera aucuns remords... [/font][/i][/justify][/size]</div></center>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Compétences[/size][/i] </div></div></div><center><div style="height:50px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px;"> [size=10][justify]• [u]Capacité raciale de Classe :[/u] Invocation. • [u]Capacité raciale Spéciale :[/u] Invocation & Dressage d'une Doll.[/justify][/size]</div> </center> </div></div></div> | | |
| | | CS-forum
{ Membre }
Messages : 34
| Merci beaucoup pour cette réponse si rapide mais ça ne fonctionne pas chez moi :s. J'ai bien fait copié/collé mais les lettres restent collées .. | | |
| | | Kory
{ Membre actif }
Messages : 370
| Bonjour, il suffit d'ajouter un padding-right et un padding-left à la div qui contient ton texte, comme ceci Si tu veux plus d'écart, tu n'as juste qu'à augmenter par un chiffre plus grand que 10
- Code:
-
<center><div style="width: 620px; -moz-border-radius: 10px 10px 20px 20px; background-color: #696969; margin-left: 0px; padding-left: 0px; padding-right: 0px;"><div style="width: 600px; -moz-border-radius: 0px 0px 0px 0px; background-image : url('http://img51.imageshack.us/img51/7973/cieln.jpg'); margin-left: 0px; padding-left: 0px; padding-right: 6px;"><div style="height:76px; width: 606px ; background-color: #696969; -moz-border-radius: 0px 0px 110px 110px;"><div style="height:70px; width: 600px ; background-color: #F8F8FF; -moz-border-radius: 0px 0px 220px 220px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=24]Invokers[/i][/size] [i][size=12]"Viens à moi, serviteur."[/i][/size]
</div></div></div> <div style="width: 510px ; background-color: #696969; -moz-border-radius: 5px 5px 5px 5px;"><span style="font-family: Georgia; color: #000000; letter-spacing: 2px; font-size: 14px;">[img]http://img836.imageshack.us/img836/9564/invokers.png[/img]</div>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Description[/size][/i] </div></div></div><center><div style="height:430px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px; padding-left: 10px; padding-right: 10px;"> [size=12][justify][font=Georgia][i] Faire voler en éclats la barrière de l'irréel par la force d'un simple mot ne relève assurément pas du surréalisme pour les Invokers. Leur parole gonfle, s'amplifie avant de se matérialiser sous la forme de la créature souhaitée. Là se dessinent les premières limites à la conception : cet animal se doit d'appartenir à la réalité. Faire surgir de nulle part un dragon, furie, phœnix ou autre chimère ne se situe manifestement pas dans les cordes d'un Invoker.
Une de ces invocations acquiert un statut tout particulier à ses yeux : la Doll. Plus vigoureuse, plus robuste que toutes celles se trouvant dans la palette de création de l'Invoker, elle se démarque non seulement de par cette puissance hors du commun, mais également du fait de la présence constante de sa personne aux côtés de son maître. La repérer se révèle rarement être une partie de difficulté : la Doll est en moyenne trois à quatre fois plus imposante que ses congénères animaux. Elle se trouve souvent être une créature des plus majestueuses : qui ne rêverait pas de détenir pour animal de compagnie un lion, un anaconda, ou encore un tigre lui obéissant au doigt et à l'œil ? Bien qu'il ne soit pas exclu de devenir l'heureux propriétaire d'un énorme castor ou bien d'une monstrueuse araignée, bien que cela ait pour effet de se révéler nettement moins imposant... Ces créatures extraordinaires sont des compagnons de choix : en plus d'être fondamentalement fidèles, et douées de paroles, elles disposent de l'immortalité. On murmure même que les Dolls de certains Invokers, parmi les plus expérimentés, possèdent quelques pouvoirs supplémentaires, telle l'autoregénération...
Difficile retour à la réalité : la magie fantastique des Invokers n'est pas sans limites. Lorsque celui-ci se trouve à bout de forces, car ces charmantes bestioles ont pour particularité de puiser sans retenue dans les réserves énergétiques de leur maître, telles d'horribles sangsues, il ne peut plus exercer sur elles la Laisse mentale. Dans l'optique où ceci se produirait, deux possibilités s'ouvrent à l'Invoker épuisé : soit la créature se contentera de retourner tranquillement à l'état de songe, ou bien, plus inconvenant, se retournera contre lui, et le fait de le blesser, ou pire, ne lui inspirera aucuns remords... [/font][/i][/justify][/size]</div></center>
<div style="height:40px; width: 220px ; background-color: #696969; -moz-border-radius: 110px 110px 0px 0px;"><div style="height:40px; width: 210px ; background-color: #F8F8FF; -moz-border-radius: 220px 220px 0px 0px;"> <div style="font-family: Georgia; text-shadow: black 1px 1px 3px">[i][size=12]Compétences[/size][/i] </div></div></div><center><div style="height:50px; width: 590px ; background-color: #696969; -moz-border-radius: 60px 5px 20px 5px; padding-left: 10px; padding-right: 10px;"> [size=10][justify]• [u]Capacité raciale de Classe :[/u] Invocation. • [u]Capacité raciale Spéciale :[/u] Invocation & Dressage d'une Doll.[/justify][/size]</div> </center> </div></div></div> | | |
| | | CS-forum
{ Membre }
Messages : 34
| Ça fonctionne impec, merci beaucoup ! (en plus j'en ai besoins partout de ce code Ö ) | | |
| | | Invité Invité
| Bien, tu n'as cas mettre ton problème résolu alors Un modérateur se chargera pour classer! | | |
| | | CS-forum
{ Membre }
Messages : 34
| Merci beaucoup ! En parlant de ça .. Comment fait-on pour affichez ces "Résolu" "En cours" ..? Si, biensur, vous acceptez de livrer vos secrets Pour un forum rpg ce serait sympa, en cours, privé, ouvert .. | | |
| | | Contenu sponsorisé
| | | | | Problème - Texte collé au bord d'une div ? | |
|
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|