Working on a responsive site a little while ago, I was running into a very strange problem where elements were refusing to line up.
I had a list of menu links (<a> tags wrapped in <li>’s) and above them I had <h3> tags labeling each section. All the widths I was using are % based. The <h3> tags were 100% of the wrapper, the <li>’s the same (and their wrapping <ul>’s), and the <a> tags were 90% width with 5% padding on the sides (90%+5%+5% = 100%) width <span>’s wrapping the inner text.
And yet somehow the <h3>’s were appearing a tiny bit longer than the <a> tags when testing on mobile! In fact they were exactly 0.5px off. That is really odd and I knew it had to do something with subpixel rendering: (more…)
Sometimes your Magento storefront may have a need for static pages that don’t quite fit in with the templates you have created. For instance, you may want to feature a certain product or person and the layout differs drastically from your product templates. When this situation occurs, you are forced to use the WYSIWYG Magento provides. It does a great job for simple layout editing, but when you want to create a complex page layout it can be quite daunting.
Here are some tips, tricks, and best practices that will help increase development speed and decrease time spent creating these pages, allowing you to get on with the rest of your day. (more…)