Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

main has been removed but is needed for IE 11 #727

Closed
thasmo opened this issue Feb 12, 2018 · 12 comments
Closed

main has been removed but is needed for IE 11 #727

thasmo opened this issue Feb 12, 2018 · 12 comments

Comments

@thasmo
Copy link

thasmo commented Feb 12, 2018

main {
    display: block;
}

is needed for IE 11 to render the element properly. Probably also for IE 10.

@sashasushko
Copy link

sashasushko commented Feb 15, 2018

It's true. This rules was removed for a mistake. figure, figcaption and few another tags really added in IE9, but main still display:inline.

Here is screen from IE11:
ie-main

@Doodidan
Copy link

The request merge is needed

@DawoodMorris
Copy link

DawoodMorris commented Mar 14, 2018 via email

@noe132
Copy link

noe132 commented Apr 18, 2018

As I thought upgrade to normalize.css 8.0.0 won't break anything as out project points to user with ie >= 10, but actually this main element issue came to me. Wonder when it'll be patched🙄

garrettw referenced this issue May 8, 2018
Drop support for older browsers: IE 9-, Android 4, Safari 7-.

Close #676
Close #690
Close #712
Close #723
Fix #718
MadeByMike added a commit to MadeByMike/normalize.css that referenced this issue Aug 18, 2018
Old versions of IE once required a bunch of html5 elements display to be set to block. The browsers that required this are possibly out of scope, however, since the `main` element was added later, a reset is still required for this element in IE11. See: necolas#727
@oles
Copy link

oles commented Aug 22, 2018

Woah. This is sorely needed. Just did the same thing as #730 (comment)

@necolas got the time to give this some love? These two pull requests solves it:
#730
#758

It got removed during your 8.0.0 release: 004d58b#diff-bb3dde41d97f19be8ab7b4780a915d5eL62

Not sure about IE10, but IE11 needs it.

@fallinov
Copy link

Please do it !

@fritzmg
Copy link

fritzmg commented Sep 7, 2018

Not sure about IE10, but IE11 needs it.

IE 10 needs it too. IE 9 and below need the html5shiv, iirc.

leofeyer pushed a commit to contao/contao that referenced this issue Sep 12, 2018
Description
-----------

While testing contao/core#8864 I noticed that the back end login of Contao 4.5 and 4.6 looks like this in IE 11:

![ie11screenshot](https://user-images.githubusercontent.com/4970961/45218806-1f59dc00-b2a9-11e8-8980-8ea4ba74d291.png)

This is because Contao 4.5 started using the `<main>` element for the `#main` container. However, IE 11 treats this as an _inline_ element by default.

See also necolas/normalize.css#727

I think this should probably also be added to the `reset.css` of the Contao CSS framework?
https://github.com/contao-components/contao/blob/8.0.2/css/reset.css#L55-L57
```diff
-header,footer,nav,section,aside,article,figure,figcaption {
+header,footer,nav,section,aside,article,figure,figcaption,main {
 	display:block;
 }
```

Commits
-------

83e01d1 fix CSS for IE11
6b9f7aa Merge branch '4.6' into ie-fix
leofeyer pushed a commit to contao/core-bundle that referenced this issue Sep 12, 2018
Description
-----------

While testing contao/core#8864 I noticed that the back end login of Contao 4.5 and 4.6 looks like this in IE 11:

![ie11screenshot](https://user-images.githubusercontent.com/4970961/45218806-1f59dc00-b2a9-11e8-8980-8ea4ba74d291.png)

This is because Contao 4.5 started using the `<main>` element for the `#main` container. However, IE 11 treats this as an _inline_ element by default.

See also necolas/normalize.css#727

I think this should probably also be added to the `reset.css` of the Contao CSS framework?
https://github.com/contao-components/contao/blob/8.0.2/css/reset.css#L55-L57
```diff
-header,footer,nav,section,aside,article,figure,figcaption {
+header,footer,nav,section,aside,article,figure,figcaption,main {
 	display:block;
 }
```

Commits
-------

83e01d11 fix CSS for IE11
6b9f7aa5 Merge branch '4.6' into ie-fix
leeoniya referenced this issue in twbs/bootstrap Nov 4, 2018
@fritzmg
Copy link

fritzmg commented Nov 8, 2018

This can be closed now since fc091cc.

@oles
Copy link

oles commented Nov 8, 2018

@fritx missing a publish to NPM though

@necolas necolas closed this as completed Nov 8, 2018
@fritzmg
Copy link

fritzmg commented Nov 8, 2018

@oles yeah, I have mentioned that here: #730 (comment)

@necolas
Copy link
Owner

necolas commented Nov 9, 2018

Forgot to publish. Should be up now. Thanks

@oles
Copy link

oles commented Nov 10, 2018

Awesome! Thank you, @necolas!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants