上部のnaviの横長さが長いのに、下のtabulatorの幅が同じになりません。
またその間になるmenuという名の表題が中央にきません。
<style>
.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title {
padding-right: 0px;
}
.tabulator{
font-size:12px;
}
.content{
margin: 50px 70px 0px 20px
}
.exo-menu{
width: 100%;
float: left;
list-style: none;
position:relative;
background: #0080ff;
margin-top:-20px;
margin-bottom:50px;
}
.exo-menu > li { display: inline-block;float:left;}
.exo-menu > li > a{
color: #fff;
text-decoration: none;
text-transform: uppercase;
border-right: 1px #365670 dotted;
-webkit-transition: color 0.2s linear, background 0.2s linear;
-moz-transition: color 0.2s linear, background 0.2s linear;
-o-transition: color 0.2s linear, background 0.2s linear;
transition: color 0.2s linear, background 0.2s linear;
}
.exo-menu > li > a.active,
.exo-menu > li > a:hover,
li.drop-down ul > li > a:hover{
background:#00b300;
color:#fff;
}
.exo-menu i {
float: left;
font-size: 18px;
margin-right: 6px;
line-height: 20px !important;
}
/*responsive*/
@media (min-width:767px){
.exo-menu > li > a{
display:block;
padding: 15px 17px;
}
@media (max-width:767px){
.exo-menu {
min-height: 58px;
background-color: #097e29;
width: 100%;
margin-bottom:100px;
}
.exo-menu > li > a{
width:100% ;
display:none ;
}
.exo-menu > li{
width:100%;
}
.display.exo-menu > li > a{
display:block ;
padding: 20px 22px;
}
.mega-menu, .Images, .Blog,.flyout-right>ul,
.flyout-left>ul, li.drop-down>ul{
position:relative;
}
}
a.toggle-menu{
position: absolute;
right: 0px;
padding: 20px;
font-size: 27px;
background-color: #ccc;
color: #097e29;
top: 0px;
}
/* Menu */
.menu {
display: inline-block;
width: 500px;
background-color: #fff;
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
}
}
#fav-table th {
background-color:#dbf0f9;
}
＜script>
＜/script>
</style>
</head>
<body>
<div class="content">
<ul class="exo-menu">
<li><a href="/index.htm"><i class="fa fa-home"></i> イントラトップ</a></li>
<li class="drop-down"><a href="/bf0_cms/kf3/index.htm"><i class="fa fa-briefcase"></i>事業監理課</a></li>
<li><a href="/bf0_cms/kf3/costa.htm"><i class="fa fa-cogs"></i>コスト縮減</a></li>
<li><a href="/bf0_cms/kf3/doba.htm"><i class="fa fa-bullhorn"></i> 土木</a></li>
<li class="mega-drop-down"><a href="/bf0_cms/kf3/kidoa.htm"><i class="fa fa-list"></i> 軌道</a></li>
<li class="blog-drop-down"><a href="/bf0_cms/kf3/kena.htm"><i class="fa fa-building-o"></i> 建築</a></li>
<li class="images-drop-down"><a href="/bf0_cms/kf3/kikaia.htm"><i class="fa fa-cog"></i> 機械</a></li>
<li><a class="active" href="/bf0_cms/kf3/denkia.htm"><i class="fa fa-plug"></i> 電気</a></li>
<li><a href="/bf0_cms/kf3/sonotaa.htm"><i class="fa fa-pencil-square-o "></i> その他</a></li>
<li><a href="/bf0_cms/kf3/searcha.htm"><i class="fa fa-search"></i>全検索</a></li>
</ul>
<div><center>
<div class="menu blue">
<h2 style="text-align: center;"><a style="text-decoration: none;" href="/bf0_cms/kf3/denkia.htm"> コスト縮減事例集【電気】</a></h2>
</div>
</center></div>
<p></p>
<table id="example-table">
<thead>
<tr>
<th>番号</th>
<th>系統</th>
<th>大分類</th>
<th>小分類</th>
<th>実施年</th>
<th>地方機関</th>
<th>縮減分類</th>
<th>工法</th>
<th>設計</th>
<th>協議</th>
<th>資機材</th>
<th>コスト縮減事例（タイトル）</th>
<th>URL</th>
<th>縮減前 （百万円）</th>
<th>縮減後 （百万円）</th>
<th>縮減額 （百万円）</th>
</tr>
</thead>
<tbody>
<tr>
<td>1801</td>
<td>電気</td>
<td>強電</td>
<td>変電</td>
<td>平成25</td>
<td>東京</td>
<td>②</td>
<td></td>
<td></td>
<td></td>
<td>●</td>
<td>トップランナー変圧器の採用</td>
<td></td>
<td>―</td>
<td>―</td>
<td>6</td>
</tr>
Q&A
ベストアンサー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/10/01 10:27