I use Google Chrome to see how my code is rendered by a browser. Now everything is perfect in Chrome. When they are opened in Firefox some irregularities occurs.
<ul><li></li></ul>). Not in Firefox. ie., some height-width mismatches. (I used % to mention height, width etc.)placeholder tag.In short how to optimize the pages for Firefox?
What you really want to know is, "How do I make CSS styling consistent across all browsers?"
Browsers have base stylesheets that they use as a starting point for how to format generic HTML. Each of them uses its own similar(ish) styles. However, there are differences. You should probably look at IE, too... it's also going to look different.
The solution is to use a CSS reset like the YUI CSS reset or another CSS reset stylesheet. It will set some base values for all styles that all browsers apply, effectively "resetting" them to the same base. Some of them reduce styling to virtually nothing, requiring you to explicitly set all styles. Others just dial things back to a basic state, but they don't remove everything. What all of them do is set some base styles for all elements which will override whatever the browser would have applied automatically.
When you apply a CSS reset stylesheet, you apply your own styles afterwards. You will probably have to make adjustments to the styles you've already created, but you will find that the styles are vastly more consistent across browsers after that.
This is a basic starting point strategy for any new site design. It's much easier to start a new design this way. So the question really isn't about FireFox, or Chrome - it's about consistency in general.