Advanced Cascading Style Sheets (CSS)
Troubleshoot CSS
Troubleshooting CSS problems can be tricky. There are all the different ways that browsers handle the CSS as well as errors in your CSS and genuine bugs that cause problems. But in order to solve the problems your page is having with CSS, you need to learn to troubleshoot your designs and your CSS.
Why Use @import for External Style Sheets
It used to be that the only reason people used the @import property in CSS style sheets was to block those styles from being seen by browsers like Netscape 4. But now that those browsers are practically unheard of, it might seem like there's no good reason to use @import in your style sheets. But @import does help streamline your CSS and make it easier to manage.
Block Web Page Printing
Use CSS to prevent your Web pages from being printed. This technique relies on advanced CSS attributes that some browsers don't support. But in general, you can use this method to make it difficult for people to print your Web pages.
CSS Outline Styles
The CSS outline property is different from the border property in several ways. The CSS outline property does not take up space and they may be non-rectangular.
How to Test Different CSS Media Types
One of the biggest frustrations of building CSS style sheets for different media types is that it can be very difficult to test them without the devices in question. While you should always do some testing on the devices, initial testing can be done on your monitor with this simple technique.
CSS Outline Styles
The CSS 2 outline property is different from the border property in several ways. Primarily in that they do not take up space and they may be non-rectangular.
Adjacent Sibling CSS Selectors
CSS selectors of elements that are right next to one another. These elements are called adjacent elements or sibling elements.
Box Model Hack - Getting Internet Explorer to Play Well with CSS
The CSS box model has very specific rules for how wide a box should be when a width is applied and padding, borders, and margins are applied. However Internet Explorer doesn't follow these rules. So we need a hack to make boxes in CSS the same width or height (whichever is defined) in Internet Explorer as in other browsers.
Cascading Style Sheets (CSS) Descendant Selectors
CSS descendant selectors make it possible to define styles on elements that appear in certain locations.
CSS Navigation Elements - Make Them a Block Element - CSS Navigation
When using CSS for navigation elements, you should make the element a block-level element to aid usability on your Web site. CSS navigation is easy to do and this CSS property makes them usable.
CSS Simple Fluid Drop Shadows
Some nice looking examples of how to use CSS to create drop shadows on both images and boxes of text.
Displaying Stylesheets Dynamically
Learn how to use Dynamic HTML to use stylesheets that take advantage of the browser.
Flexible CSS Decendants
It reall doesn't matter where you put the decendants to make them work correctly in CSS
Backgrounds with Cascading Style Sheets
Use CSS style elements to change the backgrounds of your Web pages and elements within them. Set up things like watermarks quickly and easily.
Get Cooking with Photoshop and CSS - 3 Low-fat Recipes [Design Practic
If you're trying to learn CSS positioning, or maybe you know CSS really well, but you want to understand layout better, then this article will be of great help. With this article, you'll go from an empty canvas in Photoshop to a complete Web site.
Tips and Tricks for Using CSS
The biggest problem with CSS is that it is interpreted differently in every browser. But there are some methods to overcome this, without using JavaScript to create browser detection scripts.
CSS and HTML Used to Modify the Stacking Order with Z-index
Learn how to position overlapping elements so that they stack the way you want them to using the CSS property z-index. This page shows the HTML and...
Z-Index in CSS
Positioning elements with CSS can sometimes result in elements overlapping one another. With z-index you can control what element displays on top,...
Using Style Classes and IDs
Applying styles across sections of a document using class and id attributes
CSS Cursor
CSS cursor is a great property to use to modify how the cursor displays on your web pages. You can use CSS cursors to display custom CSS cursors or just display a different cursor than the default. By changing the cursor with CSS you can even create easter eggs or hidden links on your web pages.
Internet Explorer CSS Filters
CSS filters are a workaround that Microsoft created for Internet Explorer to handle many of the features that CSS3 handles natively. This article explains what CSS filters are and why you should avoid them.
HTML Scroll Box
CSS makes it easy to take a large box of text and place it in a smaller box with scroll bars. Learn how to set up scroll bars on text, tables, and even images.
Understanding the CSS Clear Property
When you float an element with the CSS float property, sometimes you want to turn off that float before the wrapping text has reached the bottom of the element. To do this, you should use the CSS clear property. But there are some challenges you should be aware of when clearing floated elements as well.
Scrollbar Colors
Changing the scrollbar with certain CSS commands is illegal in valid XHTML documents, but you can prevent designers from affecting your browser.