2015-09-11 21 views
11

Tôi phát triển mã html bằng cách sử dụng thẻ bảng và tiền phạt hoạt động trong tất cả các trình duyệt khác như Safari, Firefox, IE, vv, nhưng mã không hoạt động cho chrome như kết quả đầu ra được hiển thị trong hình ảnh đính kèm sau. Hiển thị: các vấn đề về tế bào bảng trong chrome khi làm việc tốt trong các trình duyệt khác

.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

+0

nơi là mã? Một fiddle có thể làm – Chris

+0

Bạn có bất kỳ mã nào cho điều này không :) –

+0

bạn muốn xem html ... –

Trả lời

0

Trong đoạn mã bạn được đăng có một số văn bản đi lạc. Sau khi số </tr> cuối cùng, bạn có các chữ cái ur. Có phải đó là trong trang thực? nếu có, điều đó sẽ làm cho trình duyệt hoạt động hài hước khi hiển thị bảng, vì văn bản không được chứa trong bất kỳ phần tử bảng nào.

Nó có thể chỉ là một lỗi đánh máy và dán mã của bạn, nhưng tôi đã phạm sai lầm như vậy khi giao dịch với các bảng và thấy nó gây ra vấn đề vì vậy tôi nghĩ tôi sẽ hỏi.

+0

Người hỏi ban đầu đã tìm thấy giải pháp và đăng câu trả lời của họ trong các nhận xét. –

0

Tôi đã tìm thấy giải pháp có thể giúp bạn.

Đây là giải pháp của bạn ..

td.surveyquest { 
    height: 30px !important; 
    overflow:auto !important; 
    overflow-x:hidden !important; 
    float: left; 
    padding: 0px !important; 
    -webkit-text-size-adjust: 100%; 
    font-size:14px; 
} 

Đó là ghi đè lên css. Cố gắng tránh sử dụng ! Quan trọng mỗi lần. Sử dụng nó khi cần thiết. Ngoài ra kiểm tra mã css của bạn cho nếu một số mã ghi đè hay không.

+0

đồng ý, quan trọng không nên sử dụng mọi lúc – riazshah

1

Tôi đồng ý rằng bạn nên tránh sử dụng "! Quan trọng" thường xuyên. Bạn đã thử sử dụng bảng bố cục: thuộc tính cố định chưa?

Trong trường hợp của bạn tôi sẽ nói điều gì đó như:

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

Thêm bảng khác để quấn chỉ chọn hộp kiểm

Các vấn đề liên quan