Mixing
Bootstrap 4 Cards IE 11
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
On SharePoint in the DeltaPlaceHolderMain, I have a content editor webpart, this has HTML in it which has the cards in card-columns, in IE 11 when putting the cards to more than fits on the scren, it pushes out the screen scroll and does not adhear to the media statements, i have put in. its all good when i resize, it seems that text is pushing it past, as it does not wrap text in the card divs... in Chrome its fine, works a treat, its as iff some addtional CSS is needed to handle something in IE 11. In IE 11 the exact same html (rendered without SharePoint just as a HTML file) works fine. So again it must be some SP thing in IE 11
sharepoint bootstrap-4 internet-explorer-11
asked Jan 3 at 13:22
user6061559user6061559
11
add a comment |
On SharePoint in the DeltaPlaceHolderMain, I have a content editor webpart, this has HTML in it which has the cards in card-columns, in IE 11 when putting the cards to more than fits on the scren, it pushes out the screen scroll and does not adhear to the media statements, i have put in. its all good when i resize, it seems that text is pushing it past, as it does not wrap text in the card divs... in Chrome its fine, works a treat, its as iff some addtional CSS is needed to handle something in IE 11. In IE 11 the exact same html (rendered without SharePoint just as a HTML file) works fine. So again it must be some SP thing in IE 11
sharepoint bootstrap-4 internet-explorer-11
asked Jan 3 at 13:22
user6061559user6061559
11
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58
add a comment |
On SharePoint in the DeltaPlaceHolderMain, I have a content editor webpart, this has HTML in it which has the cards in card-columns, in IE 11 when putting the cards to more than fits on the scren, it pushes out the screen scroll and does not adhear to the media statements, i have put in. its all good when i resize, it seems that text is pushing it past, as it does not wrap text in the card divs... in Chrome its fine, works a treat, its as iff some addtional CSS is needed to handle something in IE 11. In IE 11 the exact same html (rendered without SharePoint just as a HTML file) works fine. So again it must be some SP thing in IE 11
sharepoint bootstrap-4 internet-explorer-11
asked Jan 3 at 13:22
user6061559user6061559
11
On SharePoint in the DeltaPlaceHolderMain, I have a content editor webpart, this has HTML in it which has the cards in card-columns, in IE 11 when putting the cards to more than fits on the scren, it pushes out the screen scroll and does not adhear to the media statements, i have put in. its all good when i resize, it seems that text is pushing it past, as it does not wrap text in the card divs... in Chrome its fine, works a treat, its as iff some addtional CSS is needed to handle something in IE 11. In IE 11 the exact same html (rendered without SharePoint just as a HTML file) works fine. So again it must be some SP thing in IE 11
sharepoint bootstrap-4 internet-explorer-11
sharepoint bootstrap-4 internet-explorer-11
asked Jan 3 at 13:22
user6061559user6061559
11
asked Jan 3 at 13:22
user6061559user6061559
11
asked Jan 3 at 13:22
user6061559user6061559
11
asked Jan 3 at 13:22
user6061559user6061559
11
asked Jan 3 at 13:22
user6061559user6061559
11
11
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58
add a comment |
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58
add a comment |
1 Answer
1
active
oldest
votes
Try adding this CSS to your page:
.ms-webpart-cell-vertical {
table-layout: fixed;
}
Web part containers use display: table and don't wrap correctly on IE11.
answered Jan 3 at 21:05
kylejrpkylejrp
315
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54023157%2fbootstrap-4-cards-ie-11%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Try adding this CSS to your page:
.ms-webpart-cell-vertical {
table-layout: fixed;
}
Web part containers use display: table and don't wrap correctly on IE11.
answered Jan 3 at 21:05
kylejrpkylejrp
315
add a comment |
Try adding this CSS to your page:
.ms-webpart-cell-vertical {
table-layout: fixed;
}
Web part containers use display: table and don't wrap correctly on IE11.
answered Jan 3 at 21:05
kylejrpkylejrp
315
add a comment |
Try adding this CSS to your page:
.ms-webpart-cell-vertical {
table-layout: fixed;
}
Web part containers use display: table and don't wrap correctly on IE11.
answered Jan 3 at 21:05
kylejrpkylejrp
315
Try adding this CSS to your page:
.ms-webpart-cell-vertical {
table-layout: fixed;
}
Web part containers use display: table and don't wrap correctly on IE11.
answered Jan 3 at 21:05
kylejrpkylejrp
315
answered Jan 3 at 21:05
kylejrpkylejrp
315
answered Jan 3 at 21:05
kylejrpkylejrp
315
answered Jan 3 at 21:05
kylejrpkylejrp
315
315
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54023157%2fbootstrap-4-cards-ie-11%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Can you please provide the detailed steps to produce the issue with sample code and the snapshot of the output which your are getting in IE? It can help us to understand the issue and we can try to produce the issue on our end. Thanks for your understanding.
– Deepak-MSFT
Jan 4 at 6:58