IE 7 and Older Browsers [possible to style separately? – RESOLVED]

Hi Yazo,

Please accept my apologies on the lack of response. I make a point of answering every forum post promptly. When I saw your post before I intended to quickly make some updates to Microthemer and then just tell you to upgrade to solve your problem. However, I must’ve got side-tracked with that task and then forgot to respond.

I was thinking I could add some IE version specific textareas to the Custom CSS area (so you would have tabbed Custom CSS areas instead of just the regular single one). That way you can easily apply CSS styles that only target certain versions of Internet Explorer. You would need to write raw CSS code with this solution. I think it would be too messy to try to incorporate browser targeting with the regular UI CSS fields.

Does that sound acceptable?

Cheers,

Seb

Hi there,

The best I can offer is a workaround. Once I’ve updated the IE specific custom CSS areas I’ll write back here with some instructions on how to overcome the problem without writing raw CSS. Hint – it will involve creating via the UI and then copying and pasting Microthemer-generated code into the relevant IE CSS textarea.

I should be able to roll out the new Custom CSS feature tomorrow.

Cheers,

Seb

That’s great. I’ll write back here soon. Sorry I didn’t get onto it yesterday. I’m still battling a bug where the save button doesn’t work under some conditions. Bugs must take priority. But as I mentioned, your IE textarea update isn’t a major update so shouldn’t take me long.

Cheers,

Seb

Hey Yazo,

I’ve released an update (2.4.5) that now has the IE specific textareas we discussed. Here’s what you can do if you don’t want to type raw CSS code into them:

Tip: Use your regular modern browser to edit styles using Microthemer and have Internet Explorer open in another window – refresh to see changes. Microthemer can’t be used with old versions of IE, and is quickest in chrome/firefox etc.

1. In Microthemer, create a new section called “IE 7 Specific”, or “IE 8 Specific”, or create both sections.
2. Use the Microthemer UI to set styles that improve the display in whatever version of Internet Explorer you’re targeting. Don’t worry if it messes up the display in firefox or chrome for now.
3. When you’ve added various selectors to your IE specific section and things are looking good in the target IE version, click the view CSS link on the right to display the CSS code Microthemer generates.
4. Scroll through the CSS code until you find the relevant section of code. It should be easy to find because it will have something like this at the top:

/* =IE7 Specific
————————————————————– */

5. Select and copy the code for the section (you stop highlighting code when you see another section marker like the one above, or you will get to the end of the stylesheet)
6. Paste the code in the relevant textarea in the Hand Coded CSS textareas section (bottom of the standard view or accessible from the { } popup icon in the visual view).
7. Save your settings
8. Tick the checkbox to the right of the section name. In the visual view, you will need to open up the Manage Sections popup to see the checkbox.
8. On the fixed menu on the right, tick the export to micro theme option and then select “New” from the dropdown menu. Give the export the same name as the section e.g. “IE7 Specific”.
9. Click the Save button. This will create a backup of the section.
10. Delete the IE specific section and then save your settings. If you ever want to edit the IE specific styles without digging into the CSS code you can re-import the IE specific section using the “Merge” method, make your edits, copy and paste again, export again, and finally delete again (although you might find editing code easier than coding from scratch).

Note: The browser version emulation tool in Internet Explorer 11 is currently broken. In IE10 you could easily switch between IE7, 8, and 9. Now, when you do this with IE11 it ignores conditional comments! There is a discussion of this here: http://social.msdn.microsoft.com/Forums/ie/en-US/2a9b24a3-1e97-41f8-a98c-f800c0c94e64/ieconditionals-in-ie-11-developer-tool?forum=iewebdevelopment (it stumped me for a while)

To ensure that things will work in old versions of Internet Explorer you either need to use the real browsers, or try to avoid upgrading to IE 11 (it was automatic for me) or use another tool like BrowseEmAll, which is what I did. It’s a useful tool but costs money.

I hope that helps you resolve your situation. Please let me know if you get stuck with anything.

Cheers,

Sebastian

You’re very welcome Yazo.

Cheers,

Seb