I want a text box appear when my client is using only IE 11 to open my website

Question

I want a text box to appear when a user or client is opening my website using IE 11, while I'm trying to resolve a problem in my code.

Or if you maybe have an idea to resolve my problem please write to my inbox here on stackoverflow. (IE 11 is killing me...)

as you can see the problem is when you are opening It on IE it makes the images full size, and the console in ie is not helping that much for me.

Code Html

<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta charset="UTF-8">
<title>News | Designplace</title>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link href="CSS/Navigation.css" rel="stylesheet" type="text/css">
<link href="CSS/Content.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="NavScript.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">

<body>
<div class="sidenav" id="mySidenav">
<a href="/" id="homelink"></a>
<a href="news.html" id="news" class="active"></a>
<a href="contact.html" id="contact"></a>
<a href="about.html" id="about"></a>
<!--<a href="nav.html">NAv</a>-->
</div>
<div class="sidenav_small" id="mySidenav_small">
<a href="/" id="homelink"></a>
<a href="news.html" id="news" class="active"></a>
<a href="contact.html" id="contact"></a>
<a href="about.html" id="about"></a>
</div>
<div class="sidenav_icon" id="mySidenav_icon">
    <a href="javascript:void(0);" style="font-size:40px;" class="icon" onclick="myFunction()">&#9776;</a>
</div>
<div class="latest">
<h2 class="latest_news">Latest News</h2>
<a href="all_news"><h4 class="more">More...</h4></a>
<div class="table">
    <div class="tr">
        <div class="td">
            <a class="img_link" href="/art/news/00004/Review-af-macos-Mojave-public-beta.html">
                <img src="https://www.catster.com/wp-content/uploads/2017/08/A-fluffy-cat-looking-funny-surprised-or-concerned.jpg" alt="macOS">
                <div class="inner">
                    <h3>Review af macOS Mojave beta: God men ikke perfekt.
                    </h3>
                </div>
            </a>
        </div>

        <div class="th"></div>

        <div class="td">
            <a class="img_link" href="/art/news/00002/206-400-danskere-har-downloadet-ny-nemid-app-i-foerste-doegn-efter-lancering.html">
                <img src="https://www.catster.com/wp-content/uploads/2017/08/A-fluffy-cat-looking-funny-surprised-or-concerned.jpg" alt="NemID">
                <div class="inner">
                    <h3>206.400 danskere har downloadet ny NemID-app i første døgn efter lancering.
                    </h3>
                </div>
            </a>
        </div>

        <div class="th"></div>

        <div class="td">
            <a class="img_link" href="/art/news/00001/hands-on-nokias-spritnye-foraarskollektion-viser-at-billige-smartphones-ikke-behoever-at-vaere-tarvelige.html">
                <img src="https://www.catster.com/wp-content/uploads/2017/08/A-fluffy-cat-looking-funny-surprised-or-concerned.jpg" alt="Nokia telefon">
                <div class="inner">
                    <h3>Hands-on: Nokias spritnye forårskollektion viser, at billige smartphones ikke behøver at være tarvelige.
                    </h3>
                </div>
            </a>
        </div>
</div>
</div>
</body>
</head>
</html>

CSS

@charset "UTF-8";
html, body {
height: 100%;
}
.object {
height: 100%;
width: 100%;
}
.table {
display: table;
width: 100%;
}
.tr {
display: table-row;
}
.td {
display: table-cell;
/*border: 1px solid #ccc;*/
padding: 2px;
width: 31.1%
}
@media screen and (max-width: 400px) {
body {
  background-color: #596770;
    margin-left: 0px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}

.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 40px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
    font-size: 14px;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
text-decoration: none;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
    .more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    min-height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:20%;
    margin-right: 20px;
}
        .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width: 401px) and (max-width:600px) {
    body {
  background-color: #596770;
    margin-left: 0px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
th {
    width: 423px;
    height: 273px;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
.warning {
    font-size: 50px;
    text-align: center;
    margin: -10px;
}
.about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
    font-size: 18px;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
    .more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    min-height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:20%;
    margin-right: 20px;
}
        .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width: 601px) and (max-width: 720px) {
body {
  background-color: #596770;
    margin-left: 0px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
th {
    width: 423px;
    height: 273px;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
.warning {
    font-size: 70px;
    text-align: center;
    margin: -10px;
}
.about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
    font-size: 24px;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
    .more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    min-height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:20%;
    margin-right: 20px;
}
        .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width:720px) and
(max-width:750px) {
   body {
  background-color: #596770;
    margin-left: 0px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
.more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:29%;
    margin-right: 20px;
}
    .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width: 750px) and (max-width: 1280px) {
body {
  background-color: #596770;
    margin-left: 85px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.th {
    width: 20px;

}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
    .more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:20%;
    margin-right: 20px;
}
    .teaser {
    font-size:70%;
    min-height: 50%;
    padding: 5px 0px 0px 0px
}
.infoline {
    font-size: 70%;
    color:white;
}
.article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width: 1281px) and (max-width: 1440px) {
body {
  background-color: #596770;
    margin-left: 85px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
    .td {
position: relative;
color: white;
}
/* Bottom left text */
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
.more {
    float: right;
    margin-top: -45px;
    color:white;
}
    .more:hover {
    text-decoration: underline;
    }
    td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:29%;
    margin-right: 20px;
}
    .infoline {
    font-size: 13px;
}
    .article_img {
    width: 100%
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width: 1441px) and (max-width:1920px) {
    body {
  background-color: #596770;
    margin-left: 85px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
.td {
position: relative;
color: white;
}
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
.latest_news {
    width: 300px;
}
.more {
    float: right;
    margin-top: -45px;
    color:white;
}
.more:hover {
    text-decoration: underline;
    }
td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    margin-top: 5px;
    font-size: 13px;
    min-height: 25%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:22%;
    margin-right: 20px;
}
.infoline {
    font-size: 12px;
}
.article_img {
    width: 100%;
}
.article {
    margin: 0% 15%;
}
    .article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width:1921px) and (max-width:2160px) {
        body {
  background-color: #596770;
    margin-left: 85px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
.td {
position: relative;
color: white;
}
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
.latest_news {
    width: 300px;
}
.more {
    float: right;
    margin-top: -45px;
    color:white;
}
.more:hover {
    text-decoration: underline;
    }
td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    min-height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:19.5%;
    margin-right: 20px;
}
        .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%;
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}
@media screen and (min-width:2160px) and (max-width:3840px) {
        body {
  background-color: #596770;
    margin-left: 85px; /* Same as the width of the sidenav */
    margin-top: 102.5px;
    font-size: 18px; /* Increased text to enable scrolling */
     padding: 0px 52px 0px 52px;
    /*font-size: 35;*/
    color:white;
  font-family: montserrat, sans-serif;
}
.latest img {
    max-width: 100%;

}
.About {
    margin: -45px -52px 0px -52px;
}
    .warning {
    font-size: 80px;
    text-align: center;
    margin: -10px
}
    .about-line {
    margin: 30px;
}
.experimental {
    text-align: center;
}
.td {
position: relative;
color: white;
}
/* Bottom left text */
.inner {
position: absolute;
font-size: 14px;
bottom: 15px;
left: 30px;
-webkit-user-select: none; /* Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+/Edge */
user-select: none; /* Standard */
}
.img_link {
    color: white;
    text-decoration: none;
}
.latest_news {
    width: 300px;
}
.more {
    float: right;
    margin-top: -45px;
    color:white;
}
.more:hover {
    text-decoration: underline;
    }
td {
    padding: 5px 8px 5px;
}
table {
    width:100%;
}
thead {
    display: none;
}
tr:nth-of-type(2n) {
    background-color: inherit;
}
tr td:first-child {
    /*background: #f0f0f0;*/
    font-weight:normal;
    font-size:1.3em;
}
tbody td {
    display: block;  
    text-align:left;
}
tbody td:before { 
    content: attr(data-th); 
    display: block;
    text-align:left;  
    font-weight: normal;
}
tbody td::before {
    content: attr(data-th);
    display: none;
}
.img {
width: 100%;
}
.content {
width: 400px;
overflow: hidden;
}
.teaser {
    font-size: 13px;
    min-height: 50%;
}
.columnrow {
    padding: 10px 0px 10px 0px;
    display:flex;

}
.contentimage {
    Float:left;
    width:11%;
    margin-right: 20px;
}
        .infoline {
    font-size: 13px;
}
        .article_img {
    width: 100%;
}
.article {
    margin: 0% 15%;
}
.article_infoline {
    font-size: 12px;
}
    .article_teaser {
    font-size: 18px;
    margin-bottom: 10px;
}
.article_title {
    margin-bottom: 3px;
}
.article_line {
    margin: 30px 0px;
}
.article_image_text {
    font-size: 14px;
    margin-top: 0px;
}
}

EDIT: I changed the code from .Img to .Img_link > Img and that worked but if someone has an idea to get var isIE11 = !!window.MSInputMethodContext && !!document.documentMode; working with an whole javascript, I will be happy, im not that good with javascript yet.

i've tried:

function IncompatibleBrowser() {
var x = document.getElementById("simpleModal")
var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
if (true) {
    x.className += " Incompatible";
} else {
    x.className = "Compatible"
}
}

EDIT 2:

Okay the code that Zani gave worked kinda. the console in our browsers only detects the code in IE11, just a I wanted. but the code gave an error:

Script 5007: Unable to get property 'style' of undefined or null reference

This is the code that Zani gave.

<script type="text/javascript">
var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
    if(isIE11)
  document.getElementById("IDOfYourElement").style.display="block";
    </script>

_... to resolve my problem_ - what problem? – zgood Jul 24 '18 at 13:57 — zgood, Jul 24 '18 at 13:57

score 0 · Answer 1 · answered Jul 24 '18 at 14:04

0

You can target IE11 with browser sniffing. This comes with its own downsides, as you might know.

In my experience IE11 is not that bad (compared to IE8 or Safari). So there is a good chance that your issue or set of issues can be handled.

Please ask a more specific question.

answered Jul 24 '18 at 14:04

bitstarr

304
2
11

please check the code at I have attached – Jes Jul 24 '18 at 14:23

score 0 · Accepted Answer · answered Jul 24 '18 at 15:22

0

There is no problem with IE. The problem is in your code.

Please find all .img {width:100%} in your enormous CSS and replace them with
img {width:100%} (without a dot).

answered Jul 24 '18 at 15:22

Kosh

14,657
2
15
31

How should that change what ie is viewing? – Jes Jul 24 '18 at 16:23
@JessenJonas, it's self-explanatory. IE will apply `width:100%` to `img` elements, not to elements with `class="img"` which do not exist in your code. So it solves your problem. – Kosh Jul 24 '18 at 17:06
I will check on that later – Jes Jul 24 '18 at 17:14
okay that worked flawlessly but if the javascript code is working I will save that for a later time if something comes up again. – Jes Jul 24 '18 at 20:01

zani · Answer 3 · 2018-07-25T07:47:31.317

-1

<script type="text/javascript">
   var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
        if(isIE11)
   document.getElementById("IDOfYourElement").style.display="block";
        
</script>

Please first search before ask question.

Internet Explorer 11 detection

edited Jul 25 '18 at 07:47

answered Jul 24 '18 at 13:57

zani

88
9

I did search but as i could find. These only works to ie 8? – Jes Jul 24 '18 at 13:58
2

Internet Explorer 11 doesn't support condcoms. Support for them was dropped after IE 9. This won't work. – Quentin Jul 24 '18 at 14:00
https://stackoverflow.com/questions/21825157/internet-explorer-11-detection – zani Jul 24 '18 at 14:00
Is it possible that you could help me a little bit with getting this javascript to work? im not so good with javascript yet. if im not correct I has to use the function but what I have to write after is what I hoped you could help me with... – Jes Jul 24 '18 at 19:03
Copy the edited code to between head tags. – zani Jul 25 '18 at 07:31
Okay, IE11 see the script but it says it is unable to get property: SCRIPT5007: Unable to get property 'style' of undefined or null reference. And I remembered to change the ID. – Jes Jul 25 '18 at 08:26
you must set ID for your textbox and replace in to script – zani Jul 25 '18 at 08:49
I have already done that. var isIE11 = !!window.MSInputMethodContext && !!document.documentMode; if(isIE11) document.getElementById("simpleModal").style.display="block"; – Jes Jul 25 '18 at 09:00
does It work at you? – Jes Jul 25 '18 at 10:29
zani, does the code work at you? – Jes Jul 26 '18 at 08:34
https://jsfiddle.net/93814fsu/1/ – zani Jul 27 '18 at 07:57

I want a text box appear when my client is using only IE 11 to open my website

3 Answers3

Linked