CSS Hack For all IE browsers, Chrome, Sfarai, Opera

Posted April 6th, 2009 by admin and filed in css, xhtml
Add a Comment

Some css hacks for different browsers

IE 6 and below
* html {}

IE 7 and below
*:first-child+html {} * html {}

IE 7 only
*:first-child+html {}

IE 7 and modern browsers only
html>body {}

Modern browsers only (not IE 7)
html>/**/body {}

Recent Opera versions 9 and below
html:first-child {}

Google Chrome And Safari 3.1
body:nth-of-type(1) {}

Here is the links for more specific info
http://www.webdevout.net/css-hacks
http://www.evotech.net/blog/2008/09/css-hack-for-google-chrome-and-safari-31/

CSS PNG Transparency Fix for IE

Posted March 18th, 2009 by admin and filed in css, xhtml
Add a Comment

.logo {
height: 44px; width: 300px;
background: url(../../Images/logo.png) no-repeat;
_behavior: expression( /* IE6 only – transparency with proper handling of relative URLs */
this.src = this.src ? this.src : this.currentStyle.backgroundImage.split(’”‘)[1],
this.style.background = “none”,
this.style.filter = “progid:DXImageTransform.Microsoft.AlphaImageLoader(src=” + this.src + “)”);
}

Or in the head tag of the html page, you had to put this code

<!–[if lt IE 7]>
<style type=”text/css”>
.download_leftsidebar_back {
background-image: none !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
(sizingMethod=scale, src=’App_Themes/Default/images/download_leftsidebar_back.png’) ;

}
</style>
<![endif]–v

And i saw another very good idea http://www.komodomedia.com/blog/2007/11/css-png-image-fix-for-ie/

XHTML 2.0 Explained – Making the Switch – Part 2

Posted December 17th, 2007 by admin and filed in xhtml
Add a Comment

Sections and Headings

The old <h1> through <h6> tags are still in XHTML 2.0. However, there is a similar feature intended to replace them. Basically, one just defines a section and then has headings in the section. Something along these lines can be done:

<section>
<h>Heading</h>
<section>
<h>First Point Heading</h>
<p>Content</p>
</section>
<section>
<h>Second Point Heading</h>
<p>Content</p>
</section>
</section>

The point of all of this is to add a level of structure to the document. Everything is laid out simply and in a hierarchal manner. Search engines can get the information more easily, and non-visual web browsers can more easily let the blind user access the page more easily since they just have to look at the heading in the <h> tag.

The new <p> element

Unlike old versions of XHTML, in XHTML 2.0 the <p> element can contain block-level elements. (It still can’t nest <p> elements, though.) What this means is that it is possible to put lists in a <p> element, tables, and all other sorts of elements. The <p> will be more of a “conceptual idea of a paragraph” according to W3C, the makers of XHTML.

Forget <hr />, introducing <separator />

Not nearly as big of a change as all the previous lists, but <hr /> has been replaced with <separator /> in order to more clearly state its purpose. It will place a separator (usually a horizontal line) in the document.

XForms: The Future of Forms

XForms give you total control over client-side form entry and are very powerful. XForms are very complicated, and covering them completely is out of the scope of this article. However, the idea is that they use XML. Everything is in the <xforms:model> tag. The form defines generic tags which are specified by XHTML. Something like this will be done:

<xforms:model>
<xforms:instance>
<name />
<age />
<sex />
</xforms:instance>
<xforms:submission action = “post.php” method = “post” />
</xforms:model>

Then, in regular XHTML, you would go ahead and define them however you want.

<input ref = “name”>
<label>Name: </label>
</input>

<input ref = “age”>
<label>Age: </label>
</input>

<input ref = “sex”>
<label>Sex: </label>
</input>

<submit submission = “submit”>
<label>Send</label>
</submit>

If you are interested in using XForms, check out the specification:

http://www.w3.org/TR/xforms

XHTML 2.0 Explained – Making the Switch

Posted December 17th, 2007 by admin and filed in xhtml
Add a Comment

No more <img> tags?

The <object> tag has already replaced the <applet> tag and other similar tags, but now it will replace the <img> tag too. Instead of…

<img src = “someimage.png” alt = “Some Description” />

…it is now…

<object data=”someimage.png” type=”image/png”>Some Description</object>

Lines, not line breaks

The <br /> tag is now gone in favor of the new <line> tag. This is used like so this: (note that the first line is the old way and the second is the new way)

in XHTML 1.0: Mary had a little<br />lamb
in XHTML 2.0: <line>Marry had a little</line>lamb

You don’t need an <a> tag to link

It will now be possible to link to pages without using the <a> tag.

in XHTML 1.0: <h1><a href = “page2.html”>Link</a></h1>
in XHTML 2.0: <h1 href = “page2.html”>Link</h1>

XHTML 2.0 Explained – Get Ready for New Types of Lists

The <nl> tag is coming and it represents the new navigational lists. Navigational lists work so well because users select them in order to see more. It works like a menu. It has a <label> element that defines the heading for the navigation list. Something like this would be a list:

<nl>
<label>Heading</label>
<li href = “#section1″>Section1</li>
<li href = “#section2″>Section2</li>
</nl>

This is not the only new list. Definition lists have headings and list items below them. It defines four tags (dl, dd, dt, and di) but is fairly simple. Everything is in the <dl> tag and then you have a <di> for each section. The <dt> contains inline content (the heading) and the <dd> will then contain block level content. Something like this:

<dl>
<di>
<dt>Heading 1</dt>
<dd>Content Content Content</dd>
</di>
<di>
<dt>Heading 2</dt>
<dd>Content Content Content</dd>
</di>
</dl>

XHTML 2

Posted November 21st, 2007 by admin and filed in xhtml
Add a Comment

XHTML 2.0 declaration as:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 2.0//EN”
“http://www.w3.org/MarkUp/DTD/xhtml2.dtd”>

A placeholder DTD schema exists at the corresponding URI, though it currently only includes the character reference entities from previous recommendations. XHTML 2 contemplates both a version attribute and an xsi:schemalocation attribute on the root HTML element that could possibly serve as a substitute for any DOCTYPE declaration.

In addition to the DOCTYPE, all XHTML elements must be in the appropriate XML namespace for the version being used. This is usually done by declaring a default namespace on the root element using xmlns=”namespace” as in the example below.

For XHTML 1.0 and XHTML 1.1, this is

<html xmlns=”http://www.w3.org/1999/xhtml”>

XHTML 2.0 requires both a namespace and an XML Schema instance declaration. These might be declared as

<html xmlns=”http://www.w3.org/2002/06/xhtml2/”
xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance”
xsi:schemaLocation=”http://www.w3.org/2002/06/xhtml2/ http://www.w3.org/MarkUp/SCHEMA/xhtml2.xsd”>