{"id":299,"date":"2021-03-24T19:15:38","date_gmt":"2021-03-24T19:15:38","guid":{"rendered":"https:\/\/wshop.fi\/eng\/?p=299"},"modified":"2021-03-24T19:16:12","modified_gmt":"2021-03-24T19:16:12","slug":"css-centering-of-an-element","status":"publish","type":"post","link":"https:\/\/wshop.fi\/eng\/css-centering-of-an-element\/","title":{"rendered":"CSS Center &#8211; CSS Centering of an Element: Tutorial"},"content":{"rendered":"\n<p><strong>CSS Center<\/strong>\u00a0&#8211;\u00a0This short tutorial and snippet will show\u00a0<strong>how to center with CSS<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">CSS Center HTML<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;body>\n  &lt;div class=\"centerMe\">\n    &lt;!-- Put centered content here -->\n  &lt;\/div>\n&lt;\/body><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">CSS Center<\/h2>\n\n\n\n<p>This CSS centering includes styling that may be required for older versions of ie.\u00a0<em>To center an element in CSS be sure to include the elements\u00a0<strong>width<\/strong><\/em>. \u00a0For more dynamic sites, you may want to use\u00a0<a href=\"https:\/\/wshop.fi\/eng\/jquery-window-width\/\">jQuery width to get the width of the element<\/a>.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>.centerMe {\n     width: 960px;\n     margin-left: auto;\n     margin-right: auto;\n     text-align: left; \/* for ie *\/\n}\n \n\/* for ie *\/\nbody {\n  text-align: center;\n }<\/code><\/pre>\n\n\n\n<p>CSS center an element such as a div, page, or image.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>CSS Center\u00a0&#8211;\u00a0This short tutorial and snippet will show\u00a0how to center with CSS CSS Center HTML CSS Center This CSS centering includes styling that may be required for older versions of ie.\u00a0To center an element in CSS be sure to include the elements\u00a0width. \u00a0For more dynamic sites, you may want to use\u00a0jQuery width to get the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":112,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18],"tags":[],"class_list":{"0":"post-299","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-coding"},"_links":{"self":[{"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/posts\/299","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/comments?post=299"}],"version-history":[{"count":1,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/posts\/299\/revisions"}],"predecessor-version":[{"id":300,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/posts\/299\/revisions\/300"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/media\/112"}],"wp:attachment":[{"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/media?parent=299"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/categories?post=299"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wshop.fi\/eng\/wp-json\/wp\/v2\/tags?post=299"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}