{"id":4495,"date":"2009-10-24T10:58:01","date_gmt":"2009-10-24T17:58:01","guid":{"rendered":"http:\/\/css-tricks.com\/?page_id=4495"},"modified":"2009-10-24T10:58:37","modified_gmt":"2009-10-24T17:58:37","slug":"fixed-positioning-in-ie-6","status":"publish","type":"page","link":"https:\/\/css-tricks.com\/snippets\/css\/fixed-positioning-in-ie-6\/","title":{"rendered":"Fixed Positioning in IE 6"},"content":{"rendered":"<pre><code class=\"css\">* { margin:0; padding:0; }\r\nhtml, body {\r\n   height: 100%;\r\n}\r\nbody #fixedElement {\r\n   position:fixed !important;\r\n   position: absolute; \/*ie6 and above*\/\r\n   top: 0;\r\n   right: 0;\r\n}\r\n#page-wrap {\r\n    width: 600px;\r\n    margin: 0 auto; \r\n    font: 16px\/2 Georgia, Serif;\r\n}<\/code><\/pre>\n<p>The 100% height on the body and html stuff is in case you want to do fixed positioning along the bottom edge of the browser window.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>* { margin:0; padding:0; } html, body { height: 100%; } body #fixedElement { position:fixed !important; position: absolute; \/*ie6 and above*\/ top: 0; right: 0; } #page-wrap { width: 600px; margin: 0 auto; font: 16px\/2 Georgia, Serif; } The 100% height on the body and html stuff is in case you want to do fixed [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":3222,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"page-snippet.php","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":""},"tags":[],"acf":[],"jetpack-related-posts":[{"id":144404,"url":"https:\/\/css-tricks.com\/snippets\/wordpress\/remove-the-28px-push-down-from-the-admin-bar\/","url_meta":{"origin":4495,"position":0},"title":"Remove the 28px Push Down from the Admin Bar","date":"July 24, 2013","format":false,"excerpt":"For your functions.php file: add_action('get_header', 'my_filter_head'); function my_filter_head() { remove_action('wp_head', '_admin_bar_bump_cb'); } By default, if you are seeing the admin bar as a logged in WordPress user, CSS like this will be output in your head (output in the wp_head() function): This is normally a good thing, as it doesn't\u2026","rel":"","context":"With 39 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3852,"url":"https:\/\/css-tricks.com\/snippets\/css\/sticky-footer\/","url_meta":{"origin":4495,"position":1},"title":"Sticky Footer","date":"September 4, 2009","format":false,"excerpt":"Works great if you can apply a fixed height to the footer. Content! I'm the Sticky Footer. * { margin: 0; } html, body { height: 100%; } .page-wrap { min-height: 100%; \/* equal to footer height *\/ margin-bottom: -142px; } .page-wrap:after { content: \"\"; display: block; } .site-footer, .page-wrap:after\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3322,"url":"https:\/\/css-tricks.com\/snippets\/css\/exactly-center-an-imagediv-horizontally-and-vertically\/","url_meta":{"origin":4495,"position":2},"title":"Exactly Center an Image\/Div Horizontally and Vertically","date":"August 10, 2009","format":false,"excerpt":".center { width: 300px; height: 300px; position: absolute; left: 50%; top: 50%; margin-left: -150px; margin-top: -150px; } Negative margins are exactly half the height and width, which pull the element back into perfect center. Only works with elements of a fixed height\/width.","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":192863,"url":"https:\/\/css-tricks.com\/snippets\/sass\/mixin-offset-positioning\/","url_meta":{"origin":4495,"position":3},"title":"Mixin for Offset Positioning","date":"January 11, 2015","format":false,"excerpt":"If there is one shorthand CSS dramatically misses, it is the one making it possible to define the position property, as well as the four offset properties (top, right, bottom, left). Fortunately, this is typically something that can be solved with a CSS preprocessor such as Sass. We only have\u2026","rel":"","context":"With 4 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3856,"url":"https:\/\/css-tricks.com\/snippets\/css\/absolute-center-vertical-horizontal-an-image\/","url_meta":{"origin":4495,"position":4},"title":"Absolute Center (Vertical &#038; Horizontal) an Image","date":"September 4, 2009","format":false,"excerpt":"CSS background-image Technique: html { width:100%; height:100%; background:url(logo.png) center center no-repeat; } CSS + Inline Image Technique: img { position: absolute; top: 50%; left: 50%; width: 500px; height: 500px; margin-top: -250px; \/* Half the height *\/ margin-left: -250px; \/* Half the width *\/ } Table technique: html, body, #wrapper {\u2026","rel":"","context":"In &quot;Article&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":13966,"url":"https:\/\/css-tricks.com\/almanac\/properties\/b\/bottom\/","url_meta":{"origin":4495,"position":5},"title":"bottom","date":"August 31, 2011","format":false,"excerpt":"The bottom property in CSS goes hand in hand with positioning. By default, elements are static positioned in which the top property has no effect whatsoever. But when the positioning of an element is relative, absolute, or fixed, the bottom value plays a big role. div { bottom: value (px,\u2026","rel":"","context":"With 4 comments","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2011\/08\/place.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/4495"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=4495"}],"version-history":[{"count":2,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/4495\/revisions"}],"predecessor-version":[{"id":4497,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/4495\/revisions\/4497"}],"up":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3222"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=4495"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=4495"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}