Z-index is another css property that appears simple on the surface, but has some deeper rules that can cause confusion.
On the surface it may seem as simple as a positive z-index sits in front of a 0 z-index, which sits in front of a negative z-index. While that is true, there’s more to the overall equation about how a browser decides which elements display in front of others.
(more…)
When people are new to css layouts there’s a tendency to gravitate toward positioning. Positioning seems like an easy concept to grasp. On the surface you specify exactly where you want a block to be located and there it sits. Positioning is a little more complicated than it first appears though. There are a few things that can trip up a newbie and a few things to understand before positioning becomes second nature.
You can do some great things with positioning, once you develop a deeper understanding of how it works.
(more…)
CSS backgrounds are an important part of web design. The property is where you add the colors and images that sit behind your content, which controls much of the aesthetics of your site. Remove your CSS backgrounds and your site will probably be text on a white background.
While relatively easy to understand, CSS backgrounds often lead to some questions and confusion when it comes to pulling off specific techniques. Let’s see if we can clear up some of that confusion and then answer a few of those technique specific questions.
(more…)
Using css floats effectively can be confusing and it’s probably one of the things that trips up most people when they’re first learning css. However once you learn to control floated elements it opens up a whole new world of possibilities in your design and makes developing layouts much simpler.
And best of all floats really aren’t that hard to work with once you understand a few key points.
(more…)
A couple of weeks ago when writing about css vs tables I mentioned it was a myth that cross browser css was hard to implement. I thought I’d take a deeper look into cross browser css today and offer some ideas and tips to make cross browser development easier.
(more…)
One of the debates that never seems to go away in the web development community is that of css vs tables and which is better to use for the layout of your site. I’m surprised this debate continues, though admittedly I’m continuing it right now after the question was raised on my small business forum. I think much of the reason css vs tables is still debated is the misinformation people on both sides put out there. Hopefully I can clear up a few things in this post and let you make your own decision.
(more…)
You have an element in your html that you want to temporarily hide. should you change it’s visibility to hidden or its display to none? Is there any difference? How will the rest of the page respond to your element that’s sometimes seen and sometimes not?
(more…)
Most of the time when designing your site navigation you’ll turn to an image to give it that something extra. However images add weight to a web page and make additional http requests leading to longer load times. Ever since I began developing websites, I’ve looked for ways to replace images with code. Today I want to share a simple way to style navigation buttons sans images and using css only.
(more…)
Have you ever run into the situation where you’re trying to apply a css style to an element, but it won’t take? Your page it seems to be ignoring your css, but you can’t figure out why. Maybe you found yourself using !important or adding an inline style as a last resort. There’s a good chance the problem you encountered was one of css precedence.
(more…)
You might have noticed the title of this post is phrased as a question. That’s because this post isn’t meant as a me telling you how to organize your css, but rather it’s intended as an open discussion. I’ll share some thoughts and I hope those of you who are css coders will chime in with some thoughts of your own.
(more…)
