sS hcss_responstableForForms() { ret hcss([[ .responstableForForms { margin: 1em 0; /*width: 100%;*/ overflow: hidden; background: #FFF; color: #024457; border-radius: 10px; border: 1px solid #167F92; } .responstableForForms tr { border: 1px solid #D9E4E6; } .responstableForForms tr:nth-child(odd) { background-color: #EAF3F3; } .responstableForForms th { display: none; border: 1px solid #FFF; background-color: #167F92; color: #FFF; padding: 1em; } .responstableForForms th:first-child { display: table-cell; text-align: center; } .responstableForForms th:nth-child(2) { display: table-cell; } .responstableForForms th:nth-child(2) span { display: none; } .responstableForForms th:nth-child(2):after { content: attr(data-th); } @media (min-width: 480px) { .responstableForForms th:nth-child(2) span { display: block; } .responstableForForms th:nth-child(2):after { display: none; } } .responstableForForms td { display: block; word-wrap: break-word; /*max-width: 7em;*/ } .responstableForForms td:first-child { display: table-cell; text-align: center; border-right: 1px solid #D9E4E6; } @media (min-width: 480px) { .responstableForForms td { border: 1px solid #D9E4E6; } } .responstableForForms th, .responstableForForms td { text-align: left; margin: .5em 1em; } @media (min-width: 480px) { .responstableForForms th, .responstableForForms td { display: table-cell; padding: 1em; } } ]]); }