{"id":324,"date":"2013-03-15T09:41:16","date_gmt":"2013-03-15T09:41:16","guid":{"rendered":"http:\/\/learnlikeme.com\/?p=324"},"modified":"2013-03-31T09:10:06","modified_gmt":"2013-03-31T09:10:06","slug":"content-that-is-wider-than-the-article-content-width","status":"publish","type":"post","link":"http:\/\/learnlikeme.com\/index.php\/content-that-is-wider-than-the-article-content-width\/","title":{"rendered":"Dealing with content or elements that is wider than the page area"},"content":{"rendered":"<p>Some elements or contents such as images, charts or diagrams are too wide for the Article page area. In order to accomodate for this, you can either create a link so that users can download the wide element as an image or pdf file or you can &#8216;wrap&#8217; the element so that a bottom scrollbar will appear to enable the users to view the whole element by scrolling.<\/p>\n<p>&nbsp;<\/p>\n<p>To wrap elements that is too wide for the page in &#8216;Visual&#8217; editor mode, select the element and press the wrap button as shown below.<\/p>\n<p><img loading=\"lazy\" title=\"LLM Help Image 16\" alt=\"LLM Help Image 16\" src=\"http:\/\/learnlikeme.com\/wp-content\/uploads\/basics\/jpg\/help_img_16.jpg\" width=\"26\" height=\"26\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>To wrap elements that is too wide for the page in &#8216;Text&#8217; editor mode, select the block of code and press the wrap button as shown below.<\/p>\n<p><img loading=\"lazy\" title=\"LLM Help Image 17\" alt=\"LLM Help Image 17\" src=\"http:\/\/learnlikeme.com\/wp-content\/uploads\/basics\/jpg\/help_img_17.jpg\" width=\"41\" height=\"28\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>This will enclose the element in custom &#8216;blockquote&#8217; tags when you view it in the Text editor.<\/p>\n<p>&nbsp;<\/p>\n<p>When the article is displayed, the element that is too wide for the page width will have a scrollbar on the bottom so that users can scroll the element from side to side to view it fully as shown in the example below.<\/p>\n<p>&nbsp;<\/p>\n<p><em>Note: On mobile devices, the scrollbar will not appear but the element is scrollable by pressing and dragging the element.<\/em><\/p>\n<blockquote class=\"wrap\">\n<p><img loading=\"lazy\" title=\"LLM Help Image 18\" alt=\"LLM Help Image 18\" src=\"http:\/\/learnlikeme.com\/wp-content\/uploads\/basics\/jpg\/help_img_18.jpg\" width=\"960\" height=\"393\" \/><\/p>\n<\/blockquote>\n<p>&nbsp;<\/p>\n<p><a title=\"Back to Help page link\" href=\"http:\/\/learnlikeme.com\/index.php\/help\/\">::: Go back to the Help page<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Some elements or contents such as images, charts or diagrams are too wide for the Article page area. In order <br \/><a href=\"http:\/\/learnlikeme.com\/index.php\/content-that-is-wider-than-the-article-content-width\/\">more&#8230;<\/a><\/p>\n","protected":false},"author":8,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[10],"tags":[144,129,133,126,130,132,131,128,125,134],"_links":{"self":[{"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/posts\/324"}],"collection":[{"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/comments?post=324"}],"version-history":[{"count":22,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/posts\/324\/revisions"}],"predecessor-version":[{"id":552,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/posts\/324\/revisions\/552"}],"wp:attachment":[{"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/media?parent=324"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/categories?post=324"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/learnlikeme.com\/index.php\/wp-json\/wp\/v2\/tags?post=324"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}