Print style sheets, should in theory, be simple. You strip out the complicated junk from your page, and format it a little better for a piece of paper. Right? Wrong. Print style sheets are a pain in the butt. They’re hard to debug, finicky depending on the browser, and downright annoying to get perfect.
A lot of confusion surrounds the concept of block and inline elements, and its not unusual for this confusion to persist indefinitely. I’m hopefully going to clarify this tiny but influential difference for everyone in just a few images and with one CSS property.
The first image is a screen capture of the HTML and CSS I’ve used. Note how everything is behaving according to it’s default properties. The headers create line breaks, the anchor tag doesn’t.
Normally I don’t advocate for trying to style form controls in web browsers, but Windows 8 apps have some really offensive colors by default. Figuring out just how to overwrite some of the defaults of ui-light.css and ui-dark.css is quite frustrating, so I’ll explain how to fix the colors of your select boxes.
Here’s the first problem- It’s the color the option turns when it has been already selected and the select box is expanded.
The following CSS should be applicable to HTML/JS apps, you may need to make changes to make it work properly if you’re not using a page control based navigation system. This “table” is not really a table, but a bunch of dynamically generated data under a static header. The images below are the basic way I want it to look. Below that is the CSS I used to make it work, along with notes for why I did things the way I did.
Recently, I rolled off a client project where we implemented an e-commerce platform with lots of customization to meet client needs. This brought to light the delicate balance between using the platform’s existing features and customizing the user experience to more effectively accommodate your users. You want to think that every out-of-the-box solution is going to provide an optimal user experience, but we all know that’s just not the case. Every project needs tweaking.
Updating the Existing Front-End
There are some solutions and platforms that you can tell were built by developers with good coding skills but the UX is not ideal; that’s not their baileywick. The clues are in the existing CSS files. Maybe they are using points to define font-size for an online experience and setting your background-color property as “lightyellow” in your default CSS file; yup, you need some degree of damage control when…
There are many people who believe that product design is a less important part of the things we build. They almost believe that it can be left as an afterthought. I’m sure most people have heard the phrase, “Lipstick on a chicken,” or as I post this soon after the ’08 election season, the phrase, “Lipstick on a pig.” They believe that “beauty” of the product is far less important than the “workings” of the product, and so the engineering schedule and the project management behind it give the design process little play.
On the other side of the fence are those who argue that the beauty and design trumps the workings. I suppose they get this idea from the mainstream media and advertising companies who dress up products and package them such that no matter what the workings, even if…