「何時からですか?」という文字の間のスペースを減らしたいのですが、負のマージンを使って「John Appleseed」を少し使います。クラスchat-sample
とその上の要素の間。マイナスのマージンを使用しましたが、効果はありません。CSS上の余白が負の値になっています。
.panel-heading h1 {
\t padding-bottom: 0.65em;
\t color: #3399ff;
\t font-weight: bold;
}
.col-xs-12 {
\t padding-left: 0;
\t padding-right: 0;
}
.chats {
\t list-style-type: none;
\t margin: 0;
\t padding: 0;
}
.chats a {
\t display: block;
\t color: #000;
\t text-decoration: none;
}
.chats .sender.left {
\t margin-left: 10px;
}
.chats .chat-sample {
\t clear: both;
\t margin-left: 35px;
\t margin-top: -15px;
}
.glyphicon-user {
font-size: 25px;
color: #3399ff;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class='panel panel-default'>
\t \t \t \t \t <div class='panel-heading'>
\t \t \t \t \t \t <div class='btn-group pull-left'>
\t \t \t \t \t \t \t <div class='dropdown'>
\t \t \t \t \t \t \t \t <button class='btn btn-default btn-xs dropdown-toggle' data-toggle='dropdown' type='button'>
\t \t \t \t \t \t \t \t \t <span class='glyphicon glyphicon-cog'</span>
\t \t \t \t \t \t \t \t </button>
\t \t \t \t \t \t \t \t <ul class='dropdown-menu'>
\t \t \t \t \t \t \t \t \t <li><a href='#'>Delete All Chats</a></li>
\t \t \t \t \t \t \t \t \t <li><a href='#'>Log Out</a></li>
\t \t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t \t </div>
\t \t \t \t \t \t </div>
\t \t \t \t \t \t <div class='btn-group pull-right'>
\t \t \t \t \t \t \t <div class='dropdown'>
\t \t \t \t \t \t \t \t <button class='btn btn-default btn-xs dropdown-toggle' data-toggle='dropdown' type='button'>
\t \t \t \t \t \t \t \t \t <span class='glyphicon glyphicon-plus'</span>
\t \t \t \t \t \t \t \t </button>
\t \t \t \t \t \t \t \t <ul class='dropdown-menu dropdown-menu-right'>
\t \t \t \t \t \t \t \t \t <li><a href='#'>New Chat</a></li>
\t \t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t \t </div>
\t \t \t \t \t \t </div>
\t \t \t \t \t \t <h1 class='panel-title text-center'>FunChat</h1>
\t \t \t \t \t </div>
\t \t \t \t \t <div class='panel-body'>
\t \t \t \t \t \t <ul class='chats'>
\t \t \t \t \t \t \t <li>
\t \t \t \t \t \t \t \t <a href=''>
\t \t \t \t \t \t \t \t \t <div class='chat-img pull-left'><span class='glyphicon glyphicon-user'</span></div>
\t \t \t \t \t \t \t \t \t <div class='sender left pull-left'><strong>John Appleseed</strong></div>
\t \t \t \t \t \t \t \t \t <div class='timestamp text-muted pull-right'><small><span class='glyphicon glyphicon-time'></span> Thursday</small></div>
\t \t \t \t \t \t \t \t \t <p class='chat-sample text-muted'>What time is it?</p>
\t \t \t \t \t \t \t \t </a>
\t \t \t \t \t \t \t </li>
\t \t \t \t \t \t </ul>
\t \t \t \t \t </div>
\t \t \t \t </div>
誤植'glyphicon glyphicon-user' ' – j08691
@ j08691thanks。まだ同じ結果 –
ああ私はちょうどそれを解決としてそれを示唆していないそれに気づいていた – j08691