Display block and links

I very quick tips today about the display:block property in CSS. Used a lot to make tab effect or drop down menu by switching from block to none.

What about changing from inline to block? If you know work with CSS since a while you must know the difference between inline and block element. If not read this article posted here: Block elements, inline elements.

For example you want to create a menu with with big images as buttons. You could do it with padding by setting a padding top-bottom and left-right and then apply the background image on the link. Or you could set the display on you links to block and specify the height and width for them.

Changing the display of an element from inline to block or vise versa allow you more possibilities in terms of layout.

Additional tips: if you use an inline list to display your menu then you need to add a float left on the links if you choose the change the display to block.

Leave a Reply

Theme Forest ad
Wordpress Themes Collection ad
Woothemes

Poll

How do you start your WordPress plugins development projects?

View Results

Loading ... Loading ...