Its been a long time since I wrote an article in this category (Web Design) so I decided to write an article on creating a horizontal drop down menu purely with HTML and CSS. To create a simple menu see CSS Horizontal Navigation Menu. Since the horizontal drop down menu uses only CSS and HTML it doesn’t work with Internet Explorer 6. The whole drop down menu concept makes use of the CSS pseudo class :hover, when you place the mouse pointer over a parent menu the CSS “display” attribute changes to “block” and displays the drop down menu, when you move the mouse pointer away from the menu the “display” attribute changes to “none” so the drop down menu disappears.Continue Reading…

This tutorial teaches you how to create your website neatly sans tables. All along people used tables to create column layouts and templates for their websites because they shied away from learning CSS and <div>s. If you thought creating web pages with divs are difficult you are about to change your mind after reading this tutorial, because HTML tables have many problems which can be overcome using divs. Take an example of changing the size of a column while using <table> tag, expanding a column also expands the column next to it. Of course you can use colspan and rowspan attributes to correct this to an extent but that makes it cumbersome and eats up precious bytes. With tableless design in CSS you can overcome all these problems and have complete control over your design, whats more search engines also start liking your website.Continue Reading…

CSS Horizontal Navigation Menu is the basic menu sent on most of the websites just below the  logo. It is very easy to create this type of menu using HTML unordered lists and CSS. It is search engine friendly and uses a tableless design. The CSS Horizontal Menu will be created with a hover effect to spice up things. This will change the color and style of a menu item when the mouse pointer is moved over it. Lets start step-by-step building the CSS Horizontal MenuContinue Reading…