Am using css for designing my sites in that i had a problem while design css for iexplore it show good in iexplorer and the same design view differently in firefox what should i do to avoid such difference.

Reply

Well at first you should make sure that you are designing css according to w3c standards. Your css if designed acc. to standards then it should wokr both in IE and Firefox. You can always validate your css online at www.w3c.com. Find out the problems there and correct thenm accordingly.

General problems that occurs are with the type of property defined like id or a class. Double check the code you may have missplled it. Have you used '.' symbole for custom classes? This could also be a problem.

And yes always design in a step by step manner. Define one property and check it on all browsers. This makes debugging very very easy.

If you still having problems then do as.

Reply

Thanks for ur suggestion i defined the custom class and used '.' for that but the error is about the property.
i.e., i am using box model when i try to set the padding and margin property for a box(DIV) that is inside another box(DIV).
Firefox shows it correctly, but in case of Iexplorer it adds the two padding and margin in to a single padding

eg:-


this code which i used in firefox it make 40px padding between two DIV
But the same code in Iexplore it make only 20px padding between two DIV

 

 

 

Reply

Hard to say what the problem might be, exactly, without seeing your code.
Please post a link to the page or post the html and css here inside "code" tags. If they are larger files, use the "codebox" bbcodes instead.

Or you can try search:IE border collapse.

Or you can add this to your css:
.

Also, make sure you have a Document Type Declaration at the first line of your code which places IE in Standards Compliance Mode and not Quirks Mode. You can get the correct DTD from the w3c site, or, again, search:DTD IE Standards mode.

For comparison of how each Browser handles the different DTD's, check here.

Reply

Design Sites for Internet Explorer 7, then your site will look 95% the same in all other browsers like Firefox and Opera.

You can add an special style sheet for IE6 and below using the IE conditional tags.

Reply

Well I think that you should also define the border size for each class you want to use as a box. May be that can help. Second thing you can do is try renaming it as n id rather than a class.

I would like to rewiev the source code of your file. I can really help after that only! rest you will recieve guesses from every body!

I would recommend you to use "simplecss" for designing .css files. it's free and very small in size. Google for it.

Reply

Thanks for ur ideas i solved that problem and i need some tricks and tips or creating css....Guys who having ideas please share with me and get idea from other also

Reply

it depends on what program you're using. if your using dreamweaver mx 2004 or later, it's simple. check your right side panel and you will find access to your css file. Go to >Design Panel>CSS files. here, you will find each css style definition. to have more control, you must name each css definition or div. if you can't find it immediately, go to Text>CSS Styles>Manage site> here you can find the different divs so you can edit selected divs (depending on what you've named them). for more help, go to >Help>Using Dreamweaver or >Dreamweaver Help Support Center. These links will answer any questions you may have. If these don't work (u can't get online) use>Help> Getting Started Tutorials (without going online).

Sincerely,
Shah Boogie

Reply