Articles tagged with “hacks”
Here is a list of all articles tagged as “hacks”. If you enjoy the high-quality content that I provide here at Perishable Press, you may want to subscribe to our main content feed to stay current.
- The New Clearfix Method
- Say goodbye to the age-old clearfix hack and hello to the new and improved clearfix method.. The clearfix hack, or “easy-clearing” hack, is a useful method of clearing floats. I have written about the original method and even suggested a few improvements. The original clearfix hack works great, but the browsers that it targets are either obsolete or well on their way. Specifically, Internet Explorer 5 for Mac is now history, so there is no reason to bother with it when using ...
- CSS Hacks for Different Versions of Firefox
- In a perfect world, I don’t use CSS hacks, and certainly don’t recommend them. In the unpredictable, chaos of the real world, however, there are many situations where applying styles to particular browsers is indeed the optimal solution. Most of the time, I am targeting or filtering Internet Explorer (because it is so incredibly awesome), but occasionally I need to tweak something in a modern browser like Firefox, Safari, or Opera. In this article, we’ll look at CSS hacks targeting different versions of Firefox. Some of these CSS hacks don’t validate, others are proprietary, and ...
- IE6 Support Spectrum
- I know, I know, not another post about IE6! I actually typed this up a couple of weeks ago while immersed in my site redesign project. I had recently decided that I would no longer support that terrible browser, and this tangential post just kind of “fell out.” I wasn’t sure whether or not to post it, but I recently decided to purge my draft stash by posting everything for your reading pleasure. Thus, you may see a few turds in the next few weeks, but hopefully this ...
- Beware of Margins or Padding when Using the min-width Hack for IE
- While we all watch as Internet Explorer 6 dies a slow, painful death, many unfortunate designers and developers continue to find themselves dealing with IE6’s lack of support for simple things like minimum and maximum widths. Fortunately, there are solutions to this problem, primarily in the form of CSS expressions such as this: /* set the minimum width for IE 6 */ #target_element { width: expression((document.body.clientWidth < 335)? "333px" : "auto"); /* min-width for IE6 */ min-width: 333px; /* min-width for all standards-compliant ...
- Series Summary: Obsessive CSS Code Formatting
- My favorite series of articles here at Perishable Press, the “Obsessive CSS Code Formatting” articles explore the esoteric minutia involved with producing clean, well-formatted CSS code. From indention and spacing to opening and closing brackets, the obsessive CSS code series explores techniques and tricks used to transform ordinary stylesheets into streamlined masterpieces of inspiring beauty. Creating poetic CSS integrates the high art of employing consistent coding patterns and formatting methods with the practical functionality of proper syntax, logical structure, and concise delivery. These posts are extremely subjective, opening dialogue concerning the ...
- Perishable Press CSS Hackz Series Summary
- The “CSS Hackz Series” focuses on useful hacks, tricks, and workarounds for specific presentational and styling issues on various browsers. Although a majority of these articles provide solutions for Internet Explorer, other browsers are covered as well, either specifically or in general. The articles in the “Hackz” series are written to be as clear and concise as possible, focusing on application rather than theory. Thus, these posts cut right to the chase, presenting comprehensive methods and techniques aimed at those already familiar with the basic principles of Standards-based Web design. So, without further ado, here is a periodically updated list showcasing the all of the currently available articles ...
- CSS Hackz Series: Targeting and Filtering Internet Explorer 7
- Continuing the CSS Hackz Series, I present a small army of hacks for targeting and filtering Internet Explorer 7! Here, “targeting” IE 7 means to deliver CSS and/or (X)HTML to IE 7 only, while “filtering” means to deliver CSS and/or (X)HTML to every browser that is not IE 7. In other words, targeting is to include (apply), filtering is to exclude (hide). Let’s dive right in.. Conditional Comments Conditional comments are a proprietary Microsoft technique for targeting and filtering different versions of Internet Explorer. Other browsers do not ...
- CSS Hackz Series: Clearing Floats with the Clearfix Hack
- I use the CSS clearfix hack on nearly all of my sites. The clearfix hack — also known as the “Easy Clearing Hack” — is used to clear floated divisions (divs) without using structural markup. It is very effective in resolving layout issues and browser inconsistencies without the need to mix structure with presentation. There are countless variations of the clearfix hack around the Web, and for some sad reason, I keep a file updated with all of them. Recent pruning of my clearfix collection yields two excellent float-clearing techniques: First clearfix method: addresses several reported rendering and display bugs by ...
- 3 Ways to Exclude Content from WordPress Feeds
- This may surprise you, but I post quite a bit of content that never appears in the site’s main feed. It is my impression that a vast majority of subscribers are interested in web/graphic-design and development-related topics, and are really much less interested (if at all) in the miscellaneous odds and ends that wind up in the ever-expanding Perishable Press database. In the past, the process of excluding content from the main feed typically involved changing the post-date to something at least a year or so in the past. The thinking was that I ...
- CSS Hackz Series: PNG Fix for Internet Explorer
- In this CSS Hackz Series article, I outline several solutions for displaying alpha-transparent PNG (a.k.a. PNG-24 format) images in everybody’s favorite broken browser, Internet Explorer. Specifically, IE versions through 6 (excluding IE 5 for Mac) fail to support alpha-channel transparency for PNG images. In these versions of IE, every pixel containing alpha-transparency is displayed with an ugly, flat gray color. Fortunately, there are plenty of hacks and workarounds designed to “fix” IE’s PNG image-display problem. Unfortunately, every currently available solution requires the use of Microsoft’s proprietary AlphaImageLoader transparency filter 1. Thus, if ...
- CSS Hackz Series: Minimum Width, Maximum Width for Internet Explorer 6
- Opening the CSS Hackz series is the infamous CSS-expression hack for achieving minimum and maximum widths in Internet Explorer 6. Here is how to set the maximum width for IE 6: #target_element { width: expression((document.body.clientWidth > 778)? "777px" : "auto"); max-width: 777px; } Here is how to set the minimum width for IE 6: #target_element { width: expression((document.body.clientWidth < 335)? "333px" : "auto"); min-width: 333px; } Here is how to set both maximum and minimum widths for IE 6: #target_element { width: expression((document.body.clientWidth < 335)? "333px" : (document.body.clientWidth > 778)? "777px" : "auto"); max-width: 333px; min-width: 777px; } To implement any ...
- Lessons Learned Concerning the Clearfix CSS Hack
- I use the CSS clearfix hack on nearly all of my sites. The clearfix hack — also known as the “Easy Clearing Hack” — is used to clear floated divisions (divs) without using structural markup. It is very effective in resolving layout issues and browser inconsistencies without the need to mix structure with presentation. Over the course of the past few years, I have taken note of several useful bits of information regarding the Easy Clear Method. In this article, I summarize these lessons learned and present a (slightly) enhanced version of the ...
- WordPress Core Hacks Used at Perishable Press
- One of the necessary evils associated with creating a highly customized WordPress-powered site involves the inevitable necessity to hack the WordPress core. WordPress is built for mass-consumption and tends to cater to the largest audience possible, making it necessary to bend and poke around the corners to get WordPress to function in a more specific or specialized capacity. Of course, there is a major downside to tweaking core WordPress files: upgrading. The overambitious WordPress peeps are constantly rolling out upgrade after upgrade, many of which are required security fixes, patches, or whatever. The point is that editing the WordPress core on your current version of WordPress requires that you edit each and ...
- Keep it Dark: Hiding and Filtering CSS
- Hiding and filtering CSS rules for specifically targeted browsers is often a foregone conclusion when it comes to cross-browser design considerations. Rather than dive into some lengthy dialogue concerning the myriad situations and implications of such design hackery, our current scheduling restraints behoove us to simply cut to the chase and dish the goods. Having said that, we now consider this post a perpetually evolving repository of CSS filters.. Hide CSS from IE3, IE4, NS4 This method employs JavaScript to hide CSS from IE3, IE4, NS4, and any other browser that does not support document.getElementById. The script must be written as a single line. Backslashes must comment out slashes....
- CSS Hack Dumpster
- Consider this page a virtual dumpster of wonderful CSS hacks.. Commented Backslash Hack V2 This hack effectively hides anything after the “\*/” from MacIE5: /* commented backslash hack v2 \*/ div#something { boder: thin solid red; } /* end hack */ May also be used for CSS import directives: /* commented backslash hack v2 \*/ @import url(http://www.site.com/stylesheet.css); /* end hack */ Fix Division Widths in IE Fix IE’s crazy box rendering. The first line limits to only IE. The second line * html div#somediv { /* limits to all IE */ width: 300px; /* width for WinIE5.x */ w\idth: 333px; /* width for other IE */ } div#somediv { padding: 33px; width: 377; /* width for all ...
- WordPress Core File Edits at Perishable Press
- Update: After upgrading Perishable Press in 2007, many of the hacks listed on this page are no longer applicable. Please refer to our new WordPress Core Edits for current information. Otherwise, this article remains online for reference purposes only. The folks developing WordPress are continually rolling out “upgrades”. While it is generally a good idea to stay current, it can also be a bit of a pain if you have made any changes to the WordPress core files. Our recommendation? Keep a log such as this one that either includes all edits or links to posts describing them. ...