{"id":5183,"date":"2020-07-20T07:33:20","date_gmt":"2020-07-20T07:33:20","guid":{"rendered":"https:\/\/davelevy.info\/wiki\/?p=5183"},"modified":"2021-12-02T11:19:52","modified_gmt":"2021-12-02T11:19:52","slug":"scroll-bars-in-html-boxes","status":"publish","type":"post","link":"https:\/\/davelevy.info\/wiki\/scroll-bars-in-html-boxes\/","title":{"rendered":"Scroll bars in HTML Boxes"},"content":{"rendered":"<p>I am exploring text scrollbar. Here are my notes &#8230;<!--more--><\/p>\n<p>I have some css from <a href=\"https:\/\/codeburst.io\/how-to-create-horizontal-scrolling-containers-d8069651e9c6\">here<\/a>, which works fine.<\/p>\n<pre>.scroll-box {\r\n  width: 650px; \/* max width of the box, feel free to change this! *\/\r\n  overflow-x: scroll;\r\n  white-space: nowrap;\r\n}\r\n<\/pre>\n<p>The first example is held as text in the wordpress data base, the 2nd is implemented as a code snip.<\/p>\n<div class=\"scroll-box\"><span style=\"font-face: courier;\">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx<br \/>\nxxxxxxxxxxxxxxxxxxxxx<\/span><\/div>\n<p><div class=\"scroll-box\">\r\n<span><p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx<\/p><\/span>\r\n<\/div><\/p>\n<p>I am having problems with code, specifically python, because tabs and indents are significant.<\/p>\n<p>This is hard with HTML, possibly the overflow property is a better way to do this.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I am exploring text scrollbar. Here are my notes &#8230;<\/p>\n","protected":false},"author":1,"featured_media":5186,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":"","_share_on_mastodon":"0"},"categories":[3],"tags":[251,253,1498,1497,28],"class_list":["post-5183","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technology","tag-css","tag-html","tag-scrollbar","tag-text","tag-wordpress"],"share_on_mastodon":{"url":"","error":""},"jetpack_featured_media_url":"https:\/\/davelevy.info\/wiki\/wp-content\/uploads\/2020\/07\/h-scrollbar.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/posts\/5183","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/comments?post=5183"}],"version-history":[{"count":1,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/posts\/5183\/revisions"}],"predecessor-version":[{"id":6059,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/posts\/5183\/revisions\/6059"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/media\/5186"}],"wp:attachment":[{"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/media?parent=5183"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/categories?post=5183"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/davelevy.info\/wiki\/wp-json\/wp\/v2\/tags?post=5183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}