{"id":26,"date":"2004-09-01T09:01:39","date_gmt":"2004-09-01T09:01:39","guid":{"rendered":"http:\/\/lachy.id.au\/log\/2004\/09\/design-updates"},"modified":"2006-04-30T23:54:06","modified_gmt":"2006-04-30T23:54:06","slug":"design-updates","status":"publish","type":"post","link":"https:\/\/lachy.id.au\/log\/2004\/09\/design-updates","title":{"rendered":"Design Updates"},"content":{"rendered":"<p>As I wrote about <a href=\"http:\/\/www.lachy.id.au\/blogs\/log\/2004\/08\/another-redesign-now-its-my-turn\" title=\"Another Redesign (Now it\u2019s My Turn)\">previously<\/a>, I&#8217;m using a a flexible layout, constrained using min and max widths and displaying the columns using <code>display: table-cell;<\/code>.  This was mostly working fine in both <a href=\"http:\/\/www.mozilla.org\/\">Mozilla<\/a> and <a href=\"http:\/\/www.opera.com\/\">Opera<\/a> until I needed to use <code>pre<\/code> as in my <a href=\"http:\/\/www.lachy.id.au\/blogs\/log\/2004\/08\/link-relationships\" title=\"Link Relationships\">last post<\/a>.  This caused a stange bug in <a href=\"http:\/\/getfirefox.com\/\">Firefox<\/a> where the main content column was pushing the side bar outside the edge of the container, which looked really strange.  It didn&#8217;t always happen \u2014 it could sometimes be fixed by simply reloading the page, but not always and was quite frustrating.<\/p>\r\n\r\n<p>I&#8217;ve finally come up with the most acceptible solution, after trying everything else I could think of.  In the end I was tossing up between setting a fixed width on the entire content, or setting a fixed width on the <code>pre<\/code> element.  Both had their disadvantages, but I ended up setting a fixed width on the <code>pre<\/code> element because it had the least impact on the overall design.<\/p>\r\n\r\n<p>I&#8217;m quite sure it&#8217;s a bug in Firefox that was causing it, as it was not occuring in Opera.  I&#8217;ll file a bug later, but first I have to do some more tests to determine exactly what was causing it, and how to replicate it.  If anyone has any ideas, or can come up with a solution that allows both the container and <code>pre<\/code> elements to be flexible, that would be good, but for now this will have to do.<\/p>","protected":false},"excerpt":{"rendered":"As I wrote about previously, I&#8217;m using a a flexible layout, constrained using min and max widths and displaying the columns using display: table-cell;. This was mostly working fine in both Mozilla and Opera until I needed to use pre as in my last post. This caused a stange bug in Firefox where the main &hellip; <a href=\"https:\/\/lachy.id.au\/log\/2004\/09\/design-updates\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Design Updates<\/span> <span class=\"meta-nav\">&rarr;<\/span><\/a>","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[3],"tags":[],"_links":{"self":[{"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/posts\/26"}],"collection":[{"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/comments?post=26"}],"version-history":[{"count":0,"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/posts\/26\/revisions"}],"wp:attachment":[{"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/media?parent=26"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/categories?post=26"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lachy.id.au\/log\/wp-json\/wp\/v2\/tags?post=26"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}