我有一个Bootstrap面板,在表中有文本。文本的一侧是链接,另一侧是描述。我注意到的是,有时我必须伪造文本的长度,以确保文本会出现在链接/说明旁边。如何有效地设置这些行,以使文本始终位于指定的链接或描述旁边,而与文本的长度无关?我需要它足够灵活以仍然显示在同一行上,但显然在另一行上]
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="panel panel-primary">
<div class="panel-heading">
<h4>Plan</h4>
</div>
<table class="table">
<thead>
<tr>
<th>Set project strategy, tactics and timing</th>
<th><a href="" target="_blank">Project Brief</a></th>
</tr>
<tr>
<th>Choose the right channel for your communication</th>
<th><a href="" target="_blank">Channel Guidelines</a> ‌ ‌ ‌ ‌ ‌ ‌‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌‌ ‌ ‌ ‌ ‌ ‌ </th>
</tr>
<tr>
<th>Add your project to the calendar<br><br></th>
<th><a href="" target="_blank">Communications Calendar Intake</a> </th>
</tr>
<tr>
<th>Submit outbound call/text programs </th>
<th><a href="" target="_blank">website to test</a></th>
</tr>
<tr>
<th>Review vendor guidelines and share communication requirements with vendors</th>
<th style="margin-left: 100px;"><a href="" target="_blank">Vendor Guidelines</a> ‌ ‌ ‌ ‌ ‌ ‌‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌‌ ‌ ‌ ‌ ‌ ‌</th>
</tr>
</thead>
</table>
</div>
</div>
我有一个Bootstrap面板,在表中有文本。文本的一侧是链接,另一侧是描述。我注意到的是,有时我必须伪造文本的长度,以确保...
您使用的方法不适用于所有屏幕分辨率,更好的方法是使用vertical-align:middle
;