Category Archives: CSS

white-space: nowrap not working in ie

Posted in CSS, HTML by

For non-ie browsers like mozilla the below code will work:

<table>

<tr>

<td style=”white-space: nowrap”>text here</td>

</tr>

</table>

but the above will not work for ie browser, so this is what will work for ie :

<table>

<tr>

<td><span  style=”white-space: nowrap”>text here</span></td>

</tr>

</table>

ie 6 png fix – ie 6 png issue solutlion with css and/or js

Posted in CSS, javascript by

The issue is with png type of images that are not properly displayed in ie 6 (internet explorer – Version 6). I found the solution somewhere on internet while googling.

Okay, so the solution goes as below:

1) download the files needed for the solution from http://demo.avidindiainc.com/ie6pngfix/ie6PNGFixDownload.zip

2) There are 5 files in the directory after you unzip it. They are  blank.gif, iepngfix.htc, iepngfix_tilebg.js, iepngfix.php and .htaccess.

3) for solving the issue the two files blank.gif and iepngfix.htc are enough. i will explain them first and we’ll go for the rest files later.

4) Copy and paste iepngfix.htc and blank.gif into your website folder.

5) Copy and paste this into your website’s CSS or HTML:

<style type=”text/css”>
img, div { behavior: url(iepngfix.htc) }
</style>

6) now the other  files work as follow. If you want support for CSS1 background-repeat and background-position, make sure you include the add-on .JS file in your <head>:

<script type=”text/javascript” src=”iepngfix_tilebg.js”></script>

7) Suppose if it works offline but not online, in this case you may have a MIME type problem. You must ensure your server is sending the correct MIME type of “text/x-component” for .HTC files. Try one of these two easy fixes:

  • Upload the “.htaccess” file from within this script’s download ZIP to your webserver, which will make Apache send the correct MIME type.
  • Instead of calling “IEPNGFIX.HTC” from your CSS, upload IEPNGFIX.PHP to the same folder and call that instead, which also sends the right MIME type.

Thats all folks. I hope this solves your issue with ie6.

max-width, max-height for IE6

Posted in CSS, HTML by

Basically max-width, min-width, max-height and min-height are the properties of CSS 2 and are not supported by IE 6. It works well with IE 7 and mozilla firefox but not with IE 6 and lower versions of IE.

But i have found a solution for this and it goes as below:

eg: if you have one or more image to display such that there should be some restrictions of height and width of image. i.e. image should not be having width more than 500 (suppose) and height not more than 200, then the css for the image should be as given below:

img.thumb_100{

max-height:100px;

max-width:100px;

width:expression(document.body.clientWidth > 500? “500px”: “auto” );

height:expression(document.body.clientHeight > 200? “200px”: “auto” );

}

same way you can try for min-width and min-height.

Thanks,

Sachin (http://www.avidindiainc.com)

Browser detection html code

Posted in CSS, HTML by

Need some method for browser detection with HTML itself, here it is.

With this method you can detect whether your browser is IE or non-ie (i.e. mozilla firefox, safari, opera etc.)

Now you won’t have to write server side script such as php, .net and others or client side script such as javascript or vb script for browser detection and accordingly output your HTML code.

The method is simple as shown below:

For displaying HTML code only in IE:

<!--[if IE]> Here comes the HTML Code <![endif]-->

For displaying HTML code in browsers other than IE:

<!--[if !IE]>--> Here comes the HTML Code <!--<![endif]-->

Also you can have your code work with different versions of IE.
i.e.
<!--[if lt IE 7]> Here comes the HTML Code <![endif]-->

here the HTML code will work only for IE having version less than IE 7. and here lt means less than

also you can even write lte which means less than equal to

Hope this method help you out with your problems.

Sachin (samsami2u@gmail.com)