Internet Explorer 7 has some rendering issues with the aMember 4.x theme, here's what I've come across so far, together with the fixes. The CSS needs to be added to an IE-7 specific CSS file (for example ie-7.css) and called by a conditional statment by a custom theme layout.phtml file. Login & Content Column Alignment The login & content screens don't align correctly in IE7 for the default aMember 4.x theme. The problem lies with how IE7 deals with widths, rather than percentages you need in the custom file (ie-7.css) to define left & right column widths using pixels. When this is done IE7 handles the column widths and floats the right column correctly instead of stacking the elements vertically. .am-coll-left, .am-coll-right { /* width: 50%; */ width: 446px; /IE 7 needs the width defined in pixels to work */ Login Fieldset Labels The login fieldset labels need a left margin adjustment to align correctly on the login screen for the default aMember 4.x theme. Again place this in the ie-7.css file. .am-form fieldset legend { margin-left: -7px; /* IE 7 needs this left margin shift to align labels correctly */ IE Conditional Statment added to Custom layout.phtml <?php echo $this->doctype('XHTML1_TRANSITIONAL'); ?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title><?php echo $title ?></title> <?php $this->printLayoutHead(); ?> <!--[if IE 7]> <link href="/amember/application/default/views/public/css/ie-7.css" rel="stylesheet" type="text/css" /> <![endif]--> </head> Screen Shots The attached PDF file shows the problems and fixes. Though the screen shots show a customized theme the code for these login & content screens hasn't been altered (apart from visually changing colors) so remains the same as in the default theme.
Update on the CSS mods needed for IE7. I have tested with IE7 some more and actually you can keep the percentages on the login screen but for some reason must make one column greater than 50% then IE7 will work with the code. .am-coll-left { width: 51%; } .am-coll-right { width: 49%; }