RSSAll Entries in the "CSS Hacks, Tips and Tricks" Category

CSS: Most Interesting Questions I Was Asked Last Year

CSS: Most Interesting Questions I Was Asked Last Year

Tweet Wow! It’s 2012 already and a very Happy New Year to all of you! Well you can say I just woke up to the internet world after a long hiatus. Although I was blogging actively in 2010-11, I had to stop most of my online stuff and give way to becoming a parent. I am [...]

Working with line breaks in Expression Web

Working with line breaks in Expression Web

Tweet The basic formatting techniques like Line breaks, white spaces and indentation make your web content stand out and look clean and neat. The HTML <br> tag is used to add line breaks in your page. See below: marks denote line breaks. To view line breaks or other Formatting marks in Expression Web, go to [...]

Get rid of the dotted border from a focused hyperlink

Get rid of the dotted border from a focused hyperlink

Tweet You must have observed this behavior that when you click on a hyperlink it is surrounded with a dotted border as shown in the image below: I observed this behavior in Internet Explorer 8 and Firefox 3.0 and above. I also tested the behavior in Safari 4.0.4 and Google Chrome 4, but they did [...]

Difference between Screen Tips and alt attribute

Difference between Screen Tips and alt attribute

Tweet Many designers and users are confused about the difference between a screen tip/ tooltip and the alt attribute. A Screen Tip or Tool Tip gives some description about a link, menu or an item. Whereas an alt attribute is used for accessibility for those users who do not have the ability to view images [...]

To add a shadow to a box using CSS 2.1

To add a shadow to a box using CSS 2.1

Tweet In my previous article; ‘To add a shadow to a box using CSS 3 using the box-shadow property’, we explored the box-shadow property in CSS 3, available in browsers like Safari 3+ and Firefox 3.5+. But plenty of users use Internet Explorer, Chrome, Navigator and such other browsers. How can we have a shadow [...]

To add a shadow to a box using CSS 3 using the box-shadow property

To add a shadow to a box using CSS 3 using the box-shadow property

Tweet One of the best features of CSS 3 is box-shadow that allows you to add shadow to any element. The property is at present implemented only in Safari 3 onwards and Firefox 3.5 onwards. An example of the output generated by this property is shown below: Isn’t it spectacular? And this is possible with [...]

Class Selectors

Class Selectors

Tweet We learnt what ‘Element Selectors’ are and how to group declarations and selectors, in our tutorial Element Selectors in CSS. But as you advance in HTML and CSS, you will need more specialized rules to style an element.  Apart from document elements (element selectors) there are two other types of selectors you can define [...]

Universal Selector in CSS2

Universal Selector in CSS2

Tweet CSS2 had introduced a new selector, the universal selector to match any element in your page. The selector is indicated as an asterisk ‘*’. The universal selector could be used to list every element in your page. For example, * {font-size: 12px} This declaration would set the font size of all the elements used [...]

Element Selectors in CSS

Element Selectors in CSS

Tweet Why is CSS preferred by all the designers? Well that is because of its ability to separate presentation from the content and most importantly its power to edit the document style by changing a single line of code. Don’t believe me? Find it yourself! An element selector is an HTML element. There are other [...]

Most used values of the 'display' property in CSS

Most used values of the 'display' property in CSS

Tweet The display property defines how HTML elements should be displayed. display: block The element will generate a block around it with line break before and after the element.   display: inline The element will generate an inline box around it, which will be in line with rest of the content.    display: inline-block The [...]