Mi HTML es el siguiente:
<link href="https://snip-share.herokuapp.com/static/css/prism.css" rel="stylesheet" /> <pre><code class="language-Python line-numbers">import time print(time.time())</code> </pre> <script src="https://snip-share.herokuapp.com/static/js/prism.js"></script>
Salida del código anterior:
Salida del código anterior => https://i.stack.imgur.com/EDSVQ.jpg
Rendimiento esperado:
Salida esperada => https://i.stack.imgur.com/7esAU.png
Simplemente significa que solo quiero establecer el ancho del cuadro negro de acuerdo con el ancho del texto que contiene, así que amablemente sugiérame cualquier forma de hacerlo...
Envuelve el contenido con un elemento contenedor y aplica display: inline-block
.
div { display: inline-block; }
<link href="https://snip-share.herokuapp.com/static/css/prism.css" rel="stylesheet" /> <div> <pre><code class="language-Python line-numbers">import time print(time.time())</code> </pre> </div> <script src="https://snip-share.herokuapp.com/static/js/prism.js"></script>