Forum Moderators: not2easy
I'm trying to incorporate SOC using CSS-P in a left navigation bar that is dynamic (changes content when user logs in). The only solution I came up with is to extend the space under the login field to accommodate for the change in content after login. I'm doing this because I am attempting to load adsense at the very end of my code and position it where it needs to be (to enhance performance). Everything works fine in Firefox, but IE seems to love placing margins around form elements. IE's checkbox takes up more space (both height and width) than Firefox's, causing my absolutely positioned elements to show up differently on both browsers (so it appears nice and planned out in Firefox, but uneven in IE).
I've tried adding style="margin:0;" to the <input element with no success; I tried adding style="margin:0; padding:0 0 0 0;" with no success. I even tried adding extra <li> elements between the password field and the checkbox field and still nothing worked, the login form with IE simply is taking up more space (by a few pixels) than in Firefox. I've found that text fields also seem to have (by 1 pixel) irremovable margins in IE than in Firefox.
Does anyone have a solution to this? I'm trying to achieve this (and I succeed in Firefox):
¦
¦ Email:
¦ [ . . . ]
¦ Password:
¦ [ . . . ]
¦ [] Remember Me
¦ [Log in]
¦
¦
¦
¦
¦
¦ Our Sponsors
¦
¦ Ads
But in IE, I get this:
¦
¦ Email:
¦ [ . . . ]
¦ Password:
¦ [ . . . ]
¦--------------------(unwanted top margin)
¦ . . [] Remember Me-(unwanted left margin)
¦--------------------(unwanted bottom margin)
¦ [Log in]
¦
¦
¦
¦
¦ Our Sponsors
¦ Ads
#side li {font:bold 12px 'Arial'; display:block;}
<li style="padding-left:30px;"><input type="checkbox" name="rem" id="rem" /><label for="rem">Remember me</label></li>
Any ideas?
font-size: 8pt;
line-height: 8pt;
Styling input fields is hard in my experience, esp as browsers have a lot of leadway in how things should look in their "look and feel". So allowing that freedom to the browser is perhaps needed.
