gist - reading - jist
Gist: cómo establecer la altura y el ancho de una Gist incrustada (4)
Ninguna de las respuestas anteriores funciona más. Aquí está el CSS actualizado que muestra la esencia correctamente con barras de desplazamiento visibles donde sea necesario.
.gist {
max-width:350px;
overflow:auto;
}
.gist .blob-wrapper.data {
max-height:200px;
overflow:auto;
}
Vea esta publicación del blog, por ejemplo: Cómo configurar la altura y el ancho personalizados de Github Gist incrustado .
Para los fines de integrar Gists muy largas de Github en un blog de Wordpress, ¿qué código me permitirá establecer la altura para que se generen barras de desplazamiento verticales? Algo alrededor de 500px sería perfecto.
EDITAR : El problema ahora está resuelto, pero pasé mucho tiempo en este problema, creo que sería útil tener un hilo dedicado a ese problema. He publicado una respuesta a continuación que está funcionando.
Parece que han cambiado algo, así que ahora necesitas hacer esto:
<style type="text/css"> .gist {width:500px; overflow:auto} .gist .file-data {max-height: 500px;max-width: 500px;} </style>
Si su esencia está dentro de un iFrame, que se genera y no puede acceder ya que es un HTML incorporado, es posible que desee echar un vistazo a this .
<style type="text/css">
.gist {width:500px !important;}
.gist-file
.gist-data {max-height: 500px;max-width: 500px;}
</style>
<script src="https://gist.github.com/user-name/123456789.js"></script>
Ejemplo : página web de Boilerplate prestada de: http://www.dummies.com/how-to/content/a-sample-web-page-in-html.html [La respuesta funciona como se anunció a partir del 24 de febrero de 2016 con Firefox 44.0.2 en OSX Snow Leopard 10.6.8.]
<html>
<!-- Text between angle brackets is an HTML tag and is not displayed.
Most tags, such as the HTML and /HTML tags that surround the contents of
a page, come in pairs; some tags, like HR, for a horizontal rule, stand
alone. Comments, such as the text you''re reading, are not displayed when
the Web page is shown. The information between the HEAD and /HEAD tags is
not displayed. The information between the BODY and /BODY tags is displayed.-->
<head>
<title>Enter a title, displayed at the top of the window.</title>
</head>
<!-- The information between the BODY and /BODY tags is displayed.-->
<style type="text/css">
.gist {width:300px !important;}
.gist-file
.gist-data {max-height: 300px;max-width: 300px;}
</style>
<body>
<h1>Enter the main heading, usually the same as the title.</h1>
<p>Be <b>bold</b> in stating your key points. Put them in a list: </p>
<ul>
<li>The first item in your list</li>
<li>The second item; <i>italicize</i> key words</li>
</ul>
<p>Improve your image by including an image. </p>
<p><img src="http://www.mygifs.com/CoverImage.gif" alt="A Great HTML Resource"></p>
<p>Add a link to your favorite <a href="http://www.dummies.com/">Web site</a>.
Break up your page with a horizontal rule or two. </p>
<hr>
<p>Finally, link to <a href="page2.html">another page</a> in your own Web site.</p>
<!-- And add a copyright notice.-->
<p>© Wiley Publishing, 2011</p>
<script src="https://gist.github.com/lawlist/12345678.js"></script>
</body>
</html>