链接重叠彼此问题

Question

链接互相覆盖，屏幕截图为：

我使用过的CSS是：

.moderation_buttons a:link, .moderation_buttons a:active, .moderation_buttons a:visited{
padding: 1px 9px;
background: #d6d6d6;
color: #000;
margin: 3px;
text-decoration: none;}

如果有人想看到这些链接的HTML，这里是HTML：

// Working on the Moderation Buttons
$view_profile = '<a href="index.php?action=profile_student&amp;sid='.$sid.'">VIEW PROFILE</a>';
$edit = '<a href="index.php?action=edit_student&amp;sid='.$sid.'">EDIT</a>';
$delete = '<a href="index.php?action=delete_student&amp;sid='.$sid.'">DELETE</a>';
$cancel = '<a href="index.php?action=cancel_student&amp;sid='.$sid.'">CANCELATION</a>';
$admission_form = '<a href="index.php?action=cancel_student&amp;sid='.$sid.'">ADMISSION FORM</a>';
$promote = '<a href="index.php?action=promote_student&amp;sid='.$sid.'">PROMOTE</a>';
$fee = '<a href="index.php?action=fee_print_student&amp;sid='.$sid.'">FEEs</a>';

$moderation_buttons = '<div class="moderation_buttons">'.$view_profile.$edit.$delete.$cancel.$admission_form.$promote.$fee.'</div>';

如何调整它以便正确调整链接并且不会相互覆盖？

由于

Answer 1

设置

.moderation_buttons a{ display: inline-block }

锚标记不是块元素，这是因为填充没有被添加到锚标记的原因。为了做到这一点，你应该把它变成块级元素。但是因为你想在内联中使用display: inline-block样式。