? J'ai remarqué que toute modification du style J'essaie simplement d'avoir un code écrit à l'intérieur d'une balise Toute pensée?
Merci. par rapport à sa largeur n'a aucun effet. Il semble toujours être réglé sur "Auto".
(Cette balise est obligatoire en raison de bogues de iBooks connus) qui ont une largeur de 100%. Une solution de contournement consiste à mettre le à l'intérieur d'un qui a un style de fond à 100%. Cela fonctionne bien, mais je vais devoir faire face à quelques centaines de cent
tags ... C'est la raison pour laquelle je préférerais simplement modifier le < / code> largeur de la forme.
1 commentaires
3 Réponses :
Utiliser code> Les éléments sont des éléments en ligne. Réglage d'une hauteur ou d'une largeur sur ceux-ci n'ont aucun effet sur leur taille. Affichage: Inline-Block Code> :: P> code {
display: inline-block;
width: 100px; /* Whatever. The <code>'s width will change */
}
@Starx merci pour la réponse. Éligé super :).
Ajouter un voir un exemple Affichage: Bloquer ou Inline-Block selon votre exigence au code élément. Le reste devrait fonctionner comme prévu
Cette méthode ne permet pas d'autres contenus sur la même ligne: jsfiddle.net/ynq5m/1
@ROBW, généralement lorsque vous affichant des codes, il n'est pas nécessaire de les montrer en ligne droite. Ce n'est guère le cas pour moi.
La question, et votre réponse est pleine de exemples. Le marquage transforme les backticules en environnements.
@ROBW, ce n'est pas le point. Et de toute façon, j'ai également écrit dans ma réponse pour inclure inline-block à mais selon l'exigence
Si l'intention est de rendre l'élément 100% de large, comme la question suggère, alors affichage: Block est préférable: meilleur support de navigateur (et plus logique-si elle est 100% large, ce n'est pas vraiment en ligne).
Je pense que c'est un excellent moyen de résoudre ce problème consiste à utiliser Layout CSS - Overflow Strong> Ici, j'ai utilisé Tailwind CSS. Vous pouvez utiliser CSS cru pour faire cette tâche. <pre className="overflow-auto bg-gray-900 text-white p-5">
<code className="text-base font-light ">{yourCode}</code>
</pre>
w3.org/tr/html401/truct/text. HTML # H-9.2.1 Avis, le code est considéré et "en ligne", quelle largeur / hauteur n'affecte pas car sa largeur est déterminée par le contenu. Per Rob W Ci-dessous, vous devez le convertir en rendu en tant que bloc, quel bloc-block peut fonctionner.