Text Encoding

Text Encoding - Character and Base10 values
The basic format is &#xx (where &# is followed by a number )

space = &# 32;
tab = &# 9;
carriage return = &# 13;
line feed = &# 10;
less than = &# 60;
greater than = &# 62;
ampersand = &# 38;
single quote = &# 39;
double quote = &# 34;

Link:firstobject.com

Navigation menu with lists using :hover and :focus

CSS:

#focusexampleone ul{
list-style:none;
width:200px;
}
#focusexampleone li{
width:100%;
margin:1px;
text-align:center;
}
#focusexampleone a, #focusexampleone a:link, #focusexampleone a:visited{
display:block;
width:198px;
text-decoration:none;
border:1px solid #ddd;
}
#focusexampleone a:focus, #focusexampleone a:hover, #focusexampleone a:active{
background:#484;
color:#fff;
border-color:#000;
}

HTML:

• Link One
  
• Link Two
  
• Link Three
  
• Link Four
  

Printing table details spanning multiple pages

thead, tfoot and tbody allow you to separate the table into header, footer and body. This is particularly useful for large tables and when printed for example, the header and footer rows should appear on every page.

These elements must be defined in the order thead - tfoot - tbody

Note: IE fails!
IE doesn't have a clue when it comes to headers and footers, and although it renders them in the table, they will not appear at the top and bottom of every printed page.

Link:htmldog.com

How to style table columns directly?

How to style table columns directly??

Use a style in the required 'col' of the 'colgroup'
More details at:htmldog.com

The only styles that can be applied to columns are borders, backgrounds, width and visibility.

Tan Hack - (Edwardson Tan)

Basic Syntax:
Only for adjusting the width setting due to wrong CSS1 box model of IE5.x/Win browsers

/*selector recognized-IE only*/

* html selector 

{

  width:value; /*total width-IE5x/Win)*/

  w\idth:value;/*content width-otherIE)*/

}



selector

{ padding:value;

  width:value; /*content width-others)*/

}

The selector of the first rule is meant to be recognized only by IE. It utilizes the star html selector. The first declaration in the rule supplies IE5.x/Win its width value. But since other IE versions which do not have the box model bug will also pick up this value the second declaration is necessary to serve them the correct width. This second declaration has the escape character (backslash) embedded in the middle of the property name, thus, making it "invisible" to IE5.x/Win only. Character escapes are recognized by IE6/Win and IE5/Mac. Keep in mind that the backslash cannot appear before the first letter of the property since IE5.x/Win understands that.

The second rule above is recognized by all CSS-aware browsers. All the properties declared here are for all browsers including IE. The only values which IE will not apply from this rule will be width values since the first rule has a higher specificity. And because of this difference in specificity placement of these two rules relative to one another is irrelevant. Either one can precede the other.

Advantages:
One advantage of the modified form of the SBMH is that it effectively hides any escapes from browsers (other than IE) that may have difficulty with them. When a browser (other than IE) reads the star html selector it will not find any matching element in the markup and will simply move on to the next rule. It will not bother reading the declaration block. Therefore, such browsers as Opera 5 and NS4.x are effectively shielded from w\idth.

Moreover, the modified SBMH is obsolescence-proof. If and when the star html selector bug finally is fixed by Microsoft the hack will not have any negative impact on the browser. Just like Mozilla or Opera 6 for instance the hypothetical new IE without the star html bug will simply ignore the entire rule and pick up the width from the other rule. And since this new IE will presumably be implementing the correct box model (IE6 and IE5.x/mac do so already) all will be as it should be.

Example:

div#footer p{

 margin: 0 30% 0 0;

 padding: 0.5em 2em 0.5em 10%;

 background: #eee;

 font-size: 90%;

}



* html div#footer p{

font-size: 75%;/* for IE5.x/win */

f\ont-size: 90%;/* for other IEs*/

}

Tantek Celik's IE5 CSS1 Box Model Hack

Tantek Celik's IE5 CSS1 Box Model Hack

To achieve an equal width of 120px in all browsers,

Add border and padding values to text width and specify the sum (130px) as the width for IE5
(120px content width + 5px left padding + 5px right padding = 130px)

Other browsers interpreting the CSS box model correctly would identify the width as 120px from the last line of the following #container code.

However the html>body line is required for Opera5 which gets the box model wrong but understands the CSS2 Child Selector '>' correctly.

#container{

  padding:5px;

  width:130px;

  voice-family:"\"}\"";

  voice-family:inherit;

  width:120px;

}

html>body #navigation{width:120px;}

More Details: here at tantek.com

Welcome!

Ah..Yes, finally I have decided to buckle down and key-in a few lines...
It takes a lot of patience and drive to do this...!

Me..
Ramnath Ramachandran - thats my full name..
well i like to be called 'ram' :)
Working as 'Graphic Designer' at Sobha Renaissance IT, Bangalore, India.

webramdesign.blogspot.com
well this doesn't sound very friendly, but I tried all easier ones but they all were used out!
webramdesign - is the abbreviation for 'Web Design and related topics by Ramnath'

well thats all for now...