When testing the layout of a website template that I was creating in Internet Explorer (IE) and Firefox, I had a lot of trouble getting both browsers to display the content as required.
The main content is a fixed width, which is in a panel (div) that should be centered. Setting the css property text-align to "center" works for IE, but not Firefox. After doing some research, I found that FireFox has a specific CSS attribute to center align content: "-moz-center". This fixed the problem for Firefox, but the everything was left aligned in IE. After a bit of playing around with combinations of styles and attributes I managed to have both Internet Explorer and Firefox render the page properly using the same style sheet and set of styles.
My solution:
Set the alignment for Firefox in the attached stylesheet for the required div elements:
text-align: -moz-center
Set the alignment for Internet Explorer using the align attribute of the div element:
<div align="center" >
0 comments:
Post a Comment