It is not a secret it is a fact. Structure your code will always be useful. If you work in a team or if you often re-open old projects you will see that having a well structured file decrease considerably the effort needed to maintain and understand the document.
In the wonderful world of CSS you can use different selector to locate the element you want. Some of them even allow you to filter the element by a certain property. In this example we will use the “href” attribute of the “a” tag to add an image in function of the file type linked.
In other words, if I have a link to a psd file, it will automatically add a little psd icon in front of the link. All of this is done in CSS using selectors.
Here is what you need to style your category div after moving it of course :
First we take off the margin off the div container:
/*Added after moving*/
#categorydiv.postbox
{
margin:0;
}
/*Added after moving*/
#categorydiv div.ui-tabs-panel
{
margin:0;
clear:both;
}
Even if standards are set up browser don’t use the same standards style. For example the margin-bottom on a paragraph in IE hasn’t the same amount of pixel than in Firefox.
So to start on a fresh base we use CSS reset. Take off evrything and rebuild all the style you need. A comon technique is using the * selector:
*
{
margin:0;
padding:0;
}
This is very simple and reset pretty much everything that is set up originaly in the browser. Now if you want to get a more efficient and selective reset theire is some out there that can help you.
Content is determinant for the performance of your website in search engine. It really helps to have a fresh content, talking about the subject you want to rank for. For more optimization here is a little trick you can use to place your content to be read first by spiders, after any menu or sidebar. This technique use the CSS absolute position property. Read the rest of this entry »
The CSS value inherit can be used for every property. It allows you to reinisialize the CSS value to the selected property to it’s default value. For example if you use:
ul{ list-style:none }
to take off all the bullets point from your list you could use
ul.justHere{ list-style:square }
However that will set up the bullet point to be square (yes I now it’s obvious). But you might want to live the style of the bullet points down to the navigator. In this case “inherit” is the solution:
ul.justHere{ list-style:inherit }
I find it very usefull when I use a CSS reset that take off everything so I can, in some occasion bring the defaultstyle back.
Loading ...
