Logo Questions Linux Laravel Mysql Ubuntu Git Menu
HTML CSS JAVASCRIPT SQL PYTHON PHP BOOTSTRAP JAVA JQUERY R React Kotlin
 

Display: table-cell problems in chrome while working fine in other browsers

Tags:

html

css

I develop html code using table tag and its working fine in all other browser like safari, Firefox, IE etc, but code not working for chrome as result output as displayed in following attached image. 

.contfull {
  max-height: 900px;
}
body {
  background: #cbd0d4 none repeat scroll 0 0;
  color: #444444;
  font-size: 14px;
  margin: 0;
  min-width: 100% !important;
  padding: 0;
}
.content {
  margin: 0 auto;
  width: 100%;
}
.container_q {
  background: #f0efef none repeat scroll 0 0;
  float: left;
  height: 100%;
  width: 100%;
}
.header_q {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 2px 2px #e0dcdc;
  display: block;
  padding: 10px 20px 4px;
  position: relative;
  z-index: 100;
}
.logo_q {
  display: inline-block;
}
.logo_q a {
  outline: medium none;
}
.contfull {
  background: #f0efef none repeat scroll 0 0;
  display: inline-block;
  height: 100%;
  overflow-y: scroll;
  padding: 15px 2%;
  position: fixed;
  width: 60%;
}
.btncross {
  float: right;
}
.btncross a {
  background: #fff url("../imagesSurvey/cross-img.png") no-repeat scroll center center;
  border-radius: 20px;
  box-shadow: 0 0 1px 1px #f2f2f2;
  display: inline-block;
  height: 27px;
  margin-right: 3px;
  width: 27px;
}
.btncross a:hover {
  background: #e5e5e5 url("../imagesSurvey/cross-img.png") no-repeat scroll center center;
}
.btncross a.min {
  background-position: 5px 7px;
}
.btncross a.clobtn {
  background-position: -17px 7px;
}
.redcol {
  color: #ff0800;
  font-size: 14px;
  width: 10px;
}
a {
  color: #444444;
  text-decoration: none;
}
input[type="checkbox"]:not(old) {
  float: left;
  height: 28px;
  margin: 0;
  opacity: 0;
  padding: 0;
  width: 28px;
}
input[type="checkbox"]:checked:not(old) + label {
  background-position: 0 -64px;
}
input[type="checkbox"]:not(old) + label {
  background: rgba(0, 0, 0, 0) url("http://publish.adsys2.bonzaii.no/imagesSurvey/checks.png") no-repeat scroll 0 0;
  display: block;
  line-height: 24px;
  margin-left: 5px;
  padding-left: 34px;
}
input[type="text"] {
  background: #efefef none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  float: left;
  height: 17px;
  margin-top: 5px;
  outline: medium none;
  padding: 10px 0;
  text-indent: 10px;
  width: 99%;
}
textarea {
  background: #efefef none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  float: left;
  font-size: 14px;
  height: 70px;
  outline: medium none;
  overflow: auto;
  padding: 10px 0;
  text-indent: 10px;
  width: 99.5%;
}
input[type="radio"]:not(old) {
  float: left;
  margin: 0;
  opacity: 0;
  padding: 0;
  width: 28px;
}
input[type="radio"]:not(old) + label {
  background: rgba(0, 0, 0, 0) url("http://publish.adsys2.bonzaii.no/imagesSurvey/checks.png") no-repeat scroll 0 -112px;
  display: block;
  line-height: 24px;
  margin-left: 8px;
  margin-top: 0;
  min-height: 20px;
  padding: 10px 0 10px 30px;
}
input[type="radio"]:checked:not(old) + label {
  background-position: 0 -180px;
}
button {
  background: #272727 none repeat scroll 0 0;
  border: 1px solid #272727;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  float: right;
  font-family: "gothammediumwebfont";
  font-size: 14px;
  height: 38px;
  line-height: 35px;
  margin-top: 20px;
  outline: medium none;
  padding: 0 15px;
  text-transform: none;
}
button:focus {
  background: #2e2e2e none repeat scroll 0 0;
  color: #fff;
}
button:hover {
  background: #000000 none repeat scroll 0 0;
  color: #fff;
}
a.nextbtn {
  background: #272727 none repeat scroll 0 0;
  border: 1px solid #272727;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  float: right;
  font-family: "gothammediumwebfont";
  font-size: 14px;
  height: 36px;
  line-height: 36px;
  margin-top: 20px;
  outline: medium none;
  padding: 0 25px;
  text-transform: none;
}
a.nextbtn:focus {
  background: #2e2e2e none repeat scroll 0 0;
  color: #fff;
}
a.nextbtn:hover {
  background: #000000 none repeat scroll 0 0;
  color: #fff;
}
a.skipbtn {
  background: #fff none repeat scroll 0 0;
  border: 1px solid #272727;
  border-radius: 3px;
  color: #444444;
  cursor: pointer;
  float: right;
  font-family: "gothammediumwebfont";
  font-size: 14px;
  height: 20px;
  line-height: 20px;
  margin-right: 10px;
  margin-top: 20px;
  outline: medium none;
  padding: 8px 25px;
  text-decoration: none;
  text-transform: none;
}
a.skipbtn:hover {
  border: 1px solid #000000;
}
select {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  border-radius: 0 !important;
  font-family: "arial", sans-serif;
  font-size: 14px;
  height: 40px;
  margin-top: 0;
  outline: medium none;
  padding: 0;
  text-indent: 5px;
  width: 100%;
}
label.pos {
  background: #efefef none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  float: left;
  height: 17px;
  margin-top: 4px;
  overflow: hidden;
  padding: 8px 0 12px;
  position: relative;
  width: 100%;
}
label.yearwise {
  margin-right: 2%;
  width: 18%;
}
label.pos::after {
  background: rgba(0, 0, 0, 0) url("../imagesSurvey/arrow-top.png") no-repeat scroll 0 center;
  border-left: 1px solid #e7e6e6;
  color: #444;
  font-family: "GothamBook";
  padding: 8px 14px 10px;
  pointer-events: none;
  position: absolute;
  right: -1px;
  top: 1px;
}
label.pos {
  background: #efefef none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  float: left;
  height: 40px;
  margin-top: 4px;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 99%;
}
label.pos::before {
  background: #efefef url("../imagesSurvey/arrow-top.png") no-repeat scroll center center;
  border-left: 1px solid #e4e4e4;
  content: "";
  display: block;
  height: 38px;
  margin: 0;
  pointer-events: none;
  position: absolute;
  right: 1px;
  top: 1px;
  width: 44px;
}
span.radiaspace {
  float: left;
  height: 100%;
  padding: 0 2px;
  width: 20px;
}
span {
  float: left;
  padding: 0 2px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #444444;
  font-family: "gothammediumwebfont";
}
.simplehead {
  color: #444444;
  display: flex;
  font-size: 14px !important;
  font-weight: bold;
  line-height: 18px;
  margin: 0 15px 10px 0;
}
.section {
  background: #fff none repeat scroll 0 0;
  border-radius: 7px;
  box-shadow: 2px 2px 2px -1px #dedddd;
  clear: both;
  display: table;
  margin: 0 auto 20px;
  padding: 2%;
  width: 96%;
}
.section:last-child {
  margin: 0;
}
.col {
  display: block;
  float: left;
  margin: 0 0 1% 0;
  overflow: hidden;
}
ul.qa {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.qa li {
  background: #fff url("../imagesSurvey/line-img.png") repeat-x scroll left bottom;
  line-height: 2em;
  list-style: outside none none;
  margin: 0;
  padding: 10px 0;
}
.qa li:hover {
  background: #efefef url("../imagesSurvey/line-img.png") repeat-x scroll left bottom;
}
.qa li a {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.radioquestion li {
  padding: 0 !important;
}
.year {
  display: inline-block;
  padding: 3px 0;
}
ul.radpart {
  list-style: outside none none;
  margin: 40px 0 0;
  padding: 0;
}
.radpart li {
  font-size: 14px;
  list-style: outside none none;
  margin: 0;
  padding: 13px 0 10px 20px;
}
ul.longques {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.longques li {
  background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img-v.png");
  background-position: center bottom, right top;
  background-repeat: repeat-x, repeat-y;
  display: table-cell;
  padding: 0;
  text-align: center;
}
.longques li:first-child {
  background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img-v.png");
  background-position: center bottom, right top;
  background-repeat: repeat-x, repeat-y;
}
.longques li:first-child:hover {
  background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img-v.png");
  background-position: center bottom, right top;
  background-repeat: repeat-x, repeat-y;
}
.longques li:last-child {
  background-image: url("../imagesSurvey/line-img.png");
  background-position: center bottom;
  background-repeat: repeat-x;
}
.longques li:last-child:hover {
  background-image: url("../imagesSurvey/line-img.png");
  background-position: center bottom;
  background-repeat: repeat-x;
}
.longques li:hover {
  background-color: #f7f7f7;
  background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img-v.png");
  background-position: center bottom, right top;
  background-repeat: repeat-x, repeat-y;
}
.longques li span {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  text-align: center;
  width: 40px;
}
.longques li span:last-child {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.group::before,
.group::after {
  content: "";
  display: table;
}
.group::after {
  clear: both;
}
.group {} .span_3_of_3 {
  width: 100%;
}
.span_2_of_3 {
  width: 49.6%;
}
.span_1_of_3 {
  width: 32.2%;
}
.span_1_of_1 {
  width: 25%;
}
.span_4_of_1 {
  width: 49.6%;
}
.span_4_of_2 {
  width: 49.6%;
}
.span_5_of_2 {
  width: 100%;
}
p {} .longques li div {
  background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img.png");
  background-position: center bottom, center top;
  background-repeat: repeat-x, repeat-x;
  padding: 11px 10px;
}
.secure {
  margin: 0;
  padding: 0;
}
.secure ul {
  list-style: outside none none;
  margin: 0 0 0 15px;
  padding: 0;
}
.secure li {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.secure li span {
  background: rgba(0, 0, 0, 0) url("../imagesSurvey/line-img-v.png") repeat-y scroll right bottom;
  display: inline-block;
  height: 44px;
  text-align: center;
  width: 17%;
}
.namefile {
  float: left;
  height: 40px;
  line-height: 20px;
  overflow: auto;
  width: 50%;
}
.ques {
  background: rgba(0, 0, 0, 0) url("../imagesSurvey/line-img.png") repeat-x scroll center bottom;
  display: table;
  float: left;
  min-height: 40px;
  padding: 0 1%;
  text-align: center;
  width: 43%;
}
.ques:hover {
  background: #f7f7f7 url("../imagesSurvey/line-img.png") repeat-x scroll center bottom;
}
.tohide {
  display: none;
}
.empty_div {
  clear: both;
  margin: 0 0 20px;
  padding: 20px;
}
.answered {
  border: 1px solid #fff;
  opacity: 0.7;
}
.answered:hover {
  border: 1px solid #ebebeb;
  opacity: 1;
}
.survey-lite .next {
  background-position: 8px 7px;
  border-radius: 0 0 2px 2px;
  box-shadow: 0 3px 4px 0 #c7c7c7;
  top: 58px;
}
.survey-lite .prev {
  background-position: 8px -22px;
  border-radius: 2px 2px 0 0;
  bottom: 0;
  box-shadow: 0 0 4px 2px #c7c7c7;
}
.survey-lite .prev:hover {
  background-position: 8px -22px;
}
.survey-lite .next:hover {
  background-position: 8px 7px;
}
.survey-lite a,
.survey-lite a:visited {
  backface-visibility: hidden;
  background: #fff url("../imagesSurvey/icon-arrowdown.png") no-repeat scroll 0 0;
  cursor: pointer;
  height: 35px;
  left: 50%;
  margin-left: -22px;
  opacity: 0.9;
  position: fixed;
  transform: translateZ(0px);
  transition: all 0.1s linear 0s;
  width: 45px;
  z-index: 1000;
}
.survey-lite {} .survey-lite a:hover {
  backface-visibility: hidden;
  background: #fff url("../imagesSurvey/icon-arrowdown.png") no-repeat scroll 0 0;
  transform: translateZ(0px);
  transition: all 0.2s linear 0s;
}
.survey-lite .next,
.survey-lite .prev {
  display: none;
}
.radbtn {
  display: block;
  margin: 0 auto;
  width: 40px;
}
.required {
  background: red none repeat scroll 0 0;
  border-radius: 3px;
  color: #fff;
  font-size: 11px;
  margin-top: 52px;
  padding: 7px;
  position: absolute;
}
.section1 {
  border-radius: 7px;
  clear: both;
  display: table;
  margin: 0;
  position: absolute;
  width: 93%;
}
.selectIncdate {
  width: 100% !important;
}
@-moz-document url-prefix("") {
  .contfull {
    width: 60.5%;
  }
}
@media (max-width: 768px) {
  label.yearwise {
    margin-right: 2%;
    width: 25%;
  }
  .namefile {
    font-size: 12px;
    line-height: 20px;
    min-height: 40px;
    width: 35%;
  }
  .ques {
    padding: 0;
    width: 65%;
  }
  .secure ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
  }
  .longques li {
    background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img-v.png");
    background-position: center bottom, right top;
    background-repeat: repeat-x, repeat-y;
    display: inline-block;
    float: left;
    margin-bottom: 15px;
    padding: 0;
    text-align: center;
  }
  .secure li span {
    font-size: 12px;
    line-height: 18px;
    padding: 0;
    width: 18% !important;
  }
}
@media (max-width: 480px) {
  .col {
    margin: 1% 0 1% 0;
  }
  .span_3_of_3,
  .span_2_of_3,
  .span_1_of_3,
  .span_1_of_1,
  .span_5_of_2 {
    width: 100%;
  }
  label.yearwise {
    margin-bottom: 8px;
    margin-right: 0;
    width: 99% !important;
  }
  .span_4_of_1 {
    padding: 0 5px 0 0;
    width: 26.6%;
  }
  .span_4_of_2 {
    padding: 0 0 0 5px;
    width: 67.6%;
  }
  .radpart li {
    font-size: 14px !important;
    height: 64px;
    overflow-y: scroll;
    padding: 7px 0 3px !important;
  }
  ul.radpart {
    list-style: outside none none;
    margin: 45px 0 0;
    padding: 0;
  }
  .contfull {
    display: block;
    padding: 4%;
    width: 92%;
  }
  .namefile {
    min-height: auto !important;
    width: 100% !important;
  }
  .ques {
    background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img.png");
    background-position: center bottom, center top;
    background-repeat: repeat-x, repeat-x;
    margin-bottom: 10px;
    margin-top: 10px;
    min-height: inherit;
    padding: 0;
    width: 100% !important;
  }
  .ques:hover {
    background-color: #f7f7f7;
    background-image: url("../imagesSurvey/line-img.png"), url("../imagesSurvey/line-img.png");
    background-position: center bottom, center top;
    background-repeat: repeat-x, repeat-x;
  }
  .secure li span {
    font-size: 12px;
    padding: 5px 0 !important;
    width: 50px !important;
  }
  input[type="text"] {
    width: 98.5%;
  }
  textarea {
    width: 98.5%;
  }
}
@-moz-document url-prefix("") {
  @media (max-width: 2500px) {
    .contfull {
      width: 99.2%;
    }
  }
  @media (max-width: 768px) {
    .contfull {
      width: 96.2%;
    }
  }
  @media (max-width: 640px) {
    .contfull {
      width: 99.2%;
    }
  }
  @media (max-width: 480px) {
    .contfull {
      width: 96% !important;
    }
  }
  @media (max-width: 320px) {
    .contfull {
      width: 96% !important;
    }
  }
}
.survey-lite .next,
.survey-lite .prev {
  display: none;
}
.rwd-table {
  border-collapse: collapse;
  font-size: 14px !important;
  margin: 1em 0;
  width: 100%;
}
.rwd-table tr:hover {
  background: #efefef none repeat scroll 0 0;
}
td.surveyquest {
  float: left;
  font-size: 14px;
  height: 30px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 !important;
}
.rwd-table th {
  display: none;
}
.rwd-table th:last-child {
  background-image: url("../imagesSurvey/line-img.png"), none;
}
.rwd-table td {
  display: block;
  font-size: 14px;
  padding: 0 10px;
}
.rwd-table td:first-child {
  padding-top: 0.5em;
}
.rwd-table td:last-child {
  padding-bottom: 0.5em;
}
.rwd-table td::before {
  content: attr(data-th)" ";
  display: inline-block;
  font-weight: normal;
  width: 6.5em;
}
@media (max-width: 480px) {
  .rwd-table td:first-child {
    background-image: url("../imagesSurvey/line-img.png");
    background-position: center bottom;
    background-repeat: repeat-x;
    font-weight: normal;
    padding-bottom: 15px;
    padding-top: 15px;
    width: 100%;
  }
  .rwd-table th,
  .rwd-table td:first-child::before {
    padding: 0;
    width: 0;
  }
  .rwd-table th,
  .rwd-table td {
    background-image: url("../imagesSurvey/line-img.png"), none;
    text-align: left;
  }
  .rwd-table td.borderrad span.radbtn {
    display: inline-block;
    float: none;
    margin: 0 auto;
    width: 40px;
  }
  .rwd-table td::before {
    content: attr(data-th)" ";
    display: block;
    float: left;
    font-weight: normal;
    line-height: 44px;
    padding: 0;
    width: 50%;
  }
  td.surveyquest {
    float: none;
    height: auto !important;
    padding: 10px 10px 5px !important;
  }
}
@media (min-width: 480px) {
  .rwd-table td::before {
    display: none;
  }
  .rwd-table th,
  .rwd-table td {
    display: table-cell;
    font-size: 14px !important;
    font-weight: normal;
    padding: 2px 0;
  }
  .rwd-table th:first-child,
  .rwd-table td:first-child {
    background-image: none, none;
    font-size: 13px !important;
    padding-left: 10px;
  }
  .rwd-table th:last-child,
  .rwd-table td:last-child {
    background-image: url("../imagesSurvey/line-img.png"), none;
    padding-right: 0;
  }
  .rwd-table {
    color: #444444;
    overflow: hidden;
  }
  .rwd-table tr {
    border-color: #46627f;
    display: table-row;
  }
  .rwd-table th,
  .rwd-table td {
    margin: 0.5em 1em;
  }
  .rwd-table th,
  .rwd-table td {
    font-size: 13px !important;
    font-weight: normal;
  }
  .rwd-table th,
  .rwd-table td::before {
    color: #444444;
  }
  td.surveyquest {
    height: auto;
    padding: 4px 0 !important;
  }
}
.borderrad {
  background-image: url("http://publish.adsys2.bonzaii.no/imagesSurvey/line-img.png"), url("http://publish.adsys2.bonzaii.no/imagesSurvey/line-img-v.png");
  background-position: center bottom, right top;
  background-repeat: repeat-x, repeat-y;
  display: table-cell;
  padding: 5px;
  vertical-align: top;
}
<!DOCTYPE html>
<html>
<title>Simple HTML5 blog</title>

<head></head>

<body>

  <div class="content">
    <div class="container_q">

      <div class="contfull" style="width:700px !important;">
        <div style="display: block; margin-top: 0px;" class="section group tohide" id="question_6">
          <div class="col span_3_of_3">
            <div class="simplehead">
              <div>Hvor godt mener du at følgende påstander om artiklene i Skeidars kundemagasin stemmer? (1 = stemmer overhode ikke, 5 = stemmer veldig godt)</div>
            </div>
          </div>
          <div class="col span_3_of_3">
            <table class="rwd-table">

              <tbody>
                <tr>
                  <!--THIS CODE LIST OPTIONS NUMBER/TEXT-->
                  <th>&nbsp;</th>
                  <th class="borderrad">1</th>
                  <th class="borderrad">2</th>
                  <th class="borderrad">3</th>
                  <th class="borderrad">4</th>
                  <th class="borderrad">5</th>
                  <th class="borderrad">Ingen oppfatning</th>
                </tr>
                <!-- END HERE -->

                <tr>
                  <td data-th="&nbsp;" class="surveyquest">Artiklene henvender seg til meg</td>
                  <td data-th="1" class="borderrad"><span class="radbtn"> <input id="1_32964120" name="radio_32964120" value="1" type="radio"><label for="1_32964120"></label></span>
                  </td>
                  <td data-th="2" class="borderrad"><span class="radbtn"> <input id="2_32964120" name="radio_32964120" value="2" type="radio"><label for="2_32964120"></label></span>
                  </td>
                  <td data-th="3" class="borderrad"><span class="radbtn"> <input id="3_32964120" name="radio_32964120" value="3" type="radio"><label for="3_32964120"></label></span>
                  </td>
                  <td data-th="4" class="borderrad"><span class="radbtn"> <input id="4_32964120" name="radio_32964120" value="4" type="radio"><label for="4_32964120"></label></span>
                  </td>
                  <td data-th="5" class="borderrad"><span class="radbtn"> <input id="5_32964120" name="radio_32964120" value="5" type="radio"><label for="5_32964120"></label></span>
                  </td>
                  <td data-th="Ingen oppfatning" class="borderrad"><span class="radbtn"> <input id="6_32964120" name="radio_32964120" value="Ingen oppfatning" type="radio"><label for="6_32964120"></label></span>
                  </td>

                </tr>


                <tr>
                  <td data-th="&nbsp;" class="surveyquest">Artiklene ga meg ny informasjon</td>
                  <td data-th="1" class="borderrad"><span class="radbtn"> <input id="1_32991258" name="radio_32991258" value="1" type="radio"><label for="1_32991258"></label></span>
                  </td>
                  <td data-th="2" class="borderrad"><span class="radbtn"> <input id="2_32991258" name="radio_32991258" value="2" type="radio"><label for="2_32991258"></label></span>
                  </td>
                  <td data-th="3" class="borderrad"><span class="radbtn"> <input id="3_32991258" name="radio_32991258" value="3" type="radio"><label for="3_32991258"></label></span>
                  </td>
                  <td data-th="4" class="borderrad"><span class="radbtn"> <input id="4_32991258" name="radio_32991258" value="4" type="radio"><label for="4_32991258"></label></span>
                  </td>
                  <td data-th="5" class="borderrad"><span class="radbtn"> <input id="5_32991258" name="radio_32991258" value="5" type="radio"><label for="5_32991258"></label></span>
                  </td>
                  <td data-th="Ingen oppfatning" class="borderrad"><span class="radbtn"> <input id="6_32991258" name="radio_32991258" value="Ingen oppfatning" type="radio"><label for="6_32991258"></label></span>
                  </td>

                </tr>


                <tr>
                  <td data-th="&nbsp;" class="surveyquest">Artiklene er velskrevne</td>
                  <td data-th="1" class="borderrad"><span class="radbtn"> <input id="1_33018395" name="radio_33018395" value="1" type="radio"><label for="1_33018395"></label></span>
                  </td>
                  <td data-th="2" class="borderrad"><span class="radbtn"> <input id="2_33018395" name="radio_33018395" value="2" type="radio"><label for="2_33018395"></label></span>
                  </td>
                  <td data-th="3" class="borderrad"><span class="radbtn"> <input id="3_33018395" name="radio_33018395" value="3" type="radio"><label for="3_33018395"></label></span>
                  </td>
                  <td data-th="4" class="borderrad"><span class="radbtn"> <input id="4_33018395" name="radio_33018395" value="4" type="radio"><label for="4_33018395"></label></span>
                  </td>
                  <td data-th="5" class="borderrad"><span class="radbtn"> <input id="5_33018395" name="radio_33018395" value="5" type="radio"><label for="5_33018395"></label></span>
                  </td>
                  <td data-th="Ingen oppfatning" class="borderrad"><span class="radbtn"> <input id="6_33018395" name="radio_33018395" value="Ingen oppfatning" type="radio"><label for="6_33018395"></label></span>
                  </td>

                </tr>


                <tr>
                  <td data-th="&nbsp;" class="surveyquest">Artiklene er inspirerende</td>
                  <td data-th="1" class="borderrad"><span class="radbtn"> <input id="1_33045532" name="radio_33045532" value="1" type="radio"><label for="1_33045532"></label></span>
                  </td>
                  <td data-th="2" class="borderrad"><span class="radbtn"> <input id="2_33045532" name="radio_33045532" value="2" type="radio"><label for="2_33045532"></label></span>
                  </td>
                  <td data-th="3" class="borderrad"><span class="radbtn"> <input id="3_33045532" name="radio_33045532" value="3" type="radio"><label for="3_33045532"></label></span>
                  </td>
                  <td data-th="4" class="borderrad"><span class="radbtn"> <input id="4_33045532" name="radio_33045532" value="4" type="radio"><label for="4_33045532"></label></span>
                  </td>
                  <td data-th="5" class="borderrad"><span class="radbtn"> <input id="5_33045532" name="radio_33045532" value="5" type="radio"><label for="5_33045532"></label></span>
                  </td>
                  <td data-th="Ingen oppfatning" class="borderrad"><span class="radbtn"> <input id="6_33045532" name="radio_33045532" value="Ingen oppfatning" type="radio"><label for="6_33045532"></label></span>
                  </td>

                </tr>
              </tbody>
            </table>
          </div>
        </div>

</body>

</html>

JSFIDDLE

like image 725
Sunny S.M Avatar asked Sep 11 '15 06:09

Sunny S.M

1 Answers

I agree that you should avoid using "!important" that often. Have you tried using the table-layout:fixed property?

In your case I would say something like:

.rwd-table { table-layout: fixed; }

Adding another table to wrap only the checkboxes

like image 179
Andy Avatar answered Oct 01 '22 15:10

Andy
Sign in to Comment

Related questions

Gears or HTML5 Location API on Android 1.5
Touch events are not triggered on video tags on safari for iPhone
How to stop browser from scrolling when text is selected? Potential browser bug?
select/option html tag dotted outline problem in firefox
Is it possible to upload file via $.ajax(options) or xhr.send(file) only?
Invert/change logo on scroll
Why does lineTo() change interior pixels?
Writing Custom HTML Logs
Rails ActiveRecord Session Store in HTML5 SessionStorage Instead of Cookie
Given some AABBs, find minimum total surface area AABBs that contain them all?
When are DOMs removed from memory?
Web Component - Internal Browser Caching
CSS square based on height [duplicate]
How to generate Initialization Segment of webm video to use with Media Source API
Disabling black underline on text in HTML input-field
Why doesn't the range input heed changes in value?
jquery ui-autocomplete and google chrome autocomplete
Micorosft Edge - Embedded PDF - How to Print

Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!