All Questions
Tagged with internet-explorer-11 flexbox
210
questions
0
votes
1
answer
210
views
Flexbox on my home page not working properly on IE 11
My client reported an issue with me, which is flexbox not working on product card section on home page (WordPress site)
https://hailinpower.com/
This is what it looks like on Chrome:
screenshot:
This ...
-1
votes
1
answer
1k
views
Responsive two columns layout with Flexbox [duplicate]
I want to achieve this structure using flex:
Which is responsive, on smaller screens it will look like this:
Please notice that the first div on mobile is the second one.
This is my code:
.card {...
0
votes
1
answer
153
views
IE11 flex wrapper with align-items disable scroll for flex column child
how can I enable scroll for flex column child, when flex column has max-height and contained in flex container ?
I've got an example here https://codepen.io/ChatduChesire/pen/vYKVJoR
When .modal-...
3
votes
2
answers
101
views
IE 11 element after column flex overlap
I'm trying to understand where does this go wrong on IE 11.
My footer overlaps with the main content of the page, where the main content does not have a fixed height, as the items filling it might ...
0
votes
1
answer
67
views
Flex item shrinks too much in Internet Explorer 11
I use a flexbox that consists of a left and right part, both of equal width. The first displays an image and the right some text. The code wraps well in Google Chrome but for Internet Explorer 11, it ...
6
votes
2
answers
374
views
Flex-wrap does not wrap items in IE11
I use a flexbox container that includes two divs of equal width. The left displays an image and the right some text. The code wraps the items for Google Chrome but in Internet Explorer 11, it moves ...
0
votes
1
answer
226
views
IE11 - align items not working with popup
I have a popup that I'm trying to vertically align in the page, I use flex (align-items) to do this but it doesn't work for IE11.
After some research I found there is a bug in IE11 where align-items ...
2
votes
0
answers
76
views
IE11 not restricting width with text-overflow: ellipsis [duplicate]
I have some HTML and CSS that shows a long string of text next to a button. The long string of text is vertically centered relative to the button, and the text shows an ellipsis ... so it all fits ...
0
votes
1
answer
305
views
Display :before element on a flex container in ie11
I have a flex container with a couple of children that I need to have a before element on. The before element displays if the parent container is display: block but not if it's display: flex ! is ...
0
votes
1
answer
130
views
IE11 Flex Container Overflows When Inside Table
Check out the below code sample in IE11 and Google Chrome.
In Chrome, it displays as I expect it to, but in IE11 the table expands to be far wider than the containing block. This seems to be caused ...
0
votes
1
answer
518
views
Is there a polyfill for converting css flex shorthand to longhand in order to support IE11?
Is there a polyfill for converting Flexbox flex: shorthand property to their comparable longhand properties in order to support IE11?
After doing some research I discovered a few flexbox polyfills ...
0
votes
2
answers
684
views
Using d-flex and flex-wrap in Internet Explorer 11
I have seen that this question had been asked before and I tried the different answers provided, however, none seemed to work on my code.
I am working on fixing a series of inputs that are displaying ...
0
votes
1
answer
215
views
CSS: Wrong element width and position IE11 (flexbox, position, transform)
I'm struggling since hours with a flyin in Internet Explorer 11.
I have a header with two child elements. I display them with flexbox space-between. The second element (on the right side of the ...
0
votes
1
answer
113
views
Using flexbox elements within a table in IE11
I have a table with a row that needs to show data with nested rows. To make sure the data for "Attendee Name, Title" and "Attendee Company, Org., or other" are vertically spacing the content correctly ...
0
votes
2
answers
87
views
Flexbox's child is not getting the correct height in IE11 [duplicate]
Consider this snippet (which works in all major browsers):
body {
margin: 0;
}
#main {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
display: flex;
flex-...
0
votes
1
answer
121
views
SCSS changes display: flex; to display: grid;
I am making an internal website for a company.
We have to use Internet explorer.
I am using SCSS to make this work.
This works well in most cases except when I want to use flexbox
SCSS changes
....
1
vote
1
answer
1k
views
max-width of image not working in flexbox for IE 11 but works on google chrome
I'm creating a 2 by 2 grid layout using flexbox where the first column items are merged together as shown below:
This works in Google Chrome without a problem. The image can grow until the maximum ...
0
votes
3
answers
297
views
How to make this simple landing page flex box work in all relevant browsers?
For hours I have been trying to make a simple landing box banner layout work in all relevant browsers using flexbox, but without luck. In the following there is a sketch of the layout I want to ...
2
votes
1
answer
644
views
IE 11 Flexbox child is overflowing container [duplicate]
I have put together the following example. It works on all major browsers but it does not on IE11. The content div is overflowing the flex container (no scroll bar) and pushes the footer down. Any ...
0
votes
1
answer
172
views
Flex-grow behaving differently on IE 11
I was experimenting with flexbox on IE and noticed that my navigation bar does not work the same on IE compared to all other browsers.
The navigation bar should appear on two lines as soon as the ...
0
votes
1
answer
194
views
IE11 flex child doesn't shrink to give room to other child with non-wrapping content
IE11 doesn't shrink a flex child when another child is too small to fit it's (non wrapping) content.
I have gone over the notorious IE flex bugs (https://github.com/philipwalton/flexbugs) and tried ...
0
votes
1
answer
103
views
How to make this layout look the same in both Chrome and IE 11?
I made a small page and saw a bug in it. I show you the part of the code where the bug is visible.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="...
1
vote
1
answer
622
views
How can I prevent flex items from shrinking in IE11 to be smaller than their content?
Assuming the following markup: (JSFiddle link)
.parent {
width: 200px;
border: 1px solid #ccc;
height: 300px;
display: flex;
flex-direction: column;
}
.space-avail-sets-height {
...
2
votes
2
answers
515
views
Flex works in chrome but not in IE
the html structure of the code is as shown below. Now I have given background:red to timeline className ( to check if the child gets shrink or grow when minimizing and maximizing the window size).
...
0
votes
2
answers
632
views
Overlapping flex item has different behavior in IE11 and Chrome
following this https://jsbin.com/limevid/1/edit?html,css,output , I notice that paragraph in IE starts from the top of the container instead in Chrome, paragraph overlap the container.
p {
...
0
votes
3
answers
469
views
Why doesn't my flexbox hover effects work as expected in IE 11?
I have instituted a flex-grid in my code, however its not functioning as expected in ie11 (i unfortunately need to have it work there too)—Chrome and Firefox both work fine. What seems to ...
0
votes
0
answers
122
views
html and css alignment between chrome and IE11
I am currenlty in a situation where I have this html
<div class="grid-container">
<div class="item1">1</div>
<div class="item2">
<div class="item3">3begin</...
2
votes
1
answer
1k
views
List item alignment problem with flexbox in IE 11 and Edge
I've created an ordered list of questions, with the option to edit or delete each one. I'm using Bootstrap 4 and flexboxes to design my website. The list looks great on Firefox and Chrome, but when I ...
0
votes
1
answer
130
views
IE element's height couldn't span its absolute-positioned flex container by min-height
I am making a simple page with a content-session that would span all the height of its container so that I can make a full-paged web. However, I need to make
the content's container (div.inner) ...
0
votes
3
answers
1k
views
CSS not applied when display flex is used in microsoft edge
I'm trying to apply border before and after the text. It works on all the browsers except for Microsoft edge and internet explorer. I'm using display: flex and please refer my code for details
I have ...