ベーステンプレートを更新しました
目次[非表示]
管理Vr 20221221
common(ウェブサイト共通)の表の調整
firefoxやedgeでボーダーが消える現象回避に漏れがあり、修正しました。
リッチテキストでテーブルを作成する際、セルのプロパティでテキストの中央揃え+背景色をつけることで、上記の現象が起こっておりました。
修正前
/*--- 表 ---*/
.theme-fo-base {
:is(.main-visual,.wrapper .contents,.foot ) {
.component {
&.richtext {
table {
border: none;
&[align="center"] {
margin: auto;
}
:is(thead,tbody,tr,th,td) {
border-color: $border_color;
}
thead {
tr {
th {
position: static; //FF,edgeでボーダー消える現象回避;
p {
line-height: $base_line_height;
font-size: inherit;
& + p {
margin-top: 10px !important;
}
}
}
}
}
tbody {
tr {
td {
position: static; //FF,edgeでボーダー消える現象回避;
p {
line-height: $base_line_height;
font-size: inherit;
& + p {
margin-top: 10px !important;
}
}
:is(ul,ol) {
margin: 0 0 0 25px;
}
}
}
}
}
.normal-table {
&::after {
content: "";
display: table;
clear: both;
}
}
.table-with-row-header {
&::after {
content: "";
display: table;
clear: both;
}
}
.table-with-two-headers {
overflow: auto;
&::after {
content: "";
display: table;
clear: both;
}
}
}
}
}
}
修正後
/*--- 表 ---*/
.theme-fo-base {
:is(.main-visual,.wrapper .contents,.foot ) {
.component {
&.richtext {
table {
border: none;
&[align="center"] {
margin: auto;
}
:is(thead,tbody,tr,th,td) {
border-color: $border_color;
}
:is(thead,tbody) {
tr {
:is(th,td) {
background-clip: padding-box; //FF,edgeでボーダー消える現象回避;
position: static; //FF,edgeでボーダー消える現象回避;
p {
line-height: $base_line_height;
font-size: inherit;
& + p {
margin-top: 10px !important;
}
}
:is(ul,ol) {
margin-left: 25px;
}
}
}
}
}
.normal-table {
&::after {
content: "";
display: table;
clear: both;
}
}
.table-with-row-header {
&::after {
content: "";
display: table;
clear: both;
}
}
.table-with-two-headers {
overflow: auto;
&::after {
content: "";
display: table;
clear: both;
}
}
}
}
}
}