如何将两个箭头朝向数字?

时间:2016-02-06 10:17:17

标签: javascript jquery html css

我有一个人们可以上/下投票的系统。我有两个箭头,箭头之间有一个数字。就像Stack OVerflow和Reddit一样。唯一的问题是我的箭头与数字相差太远。我尝试了填充/高度/我能想到的所有东西,但没有一个能起作用。它们都在一张桌子里,所以如果我搞砸了整个桌子的大小搞砸了。这是我的完整代码。

<table class="table">
    {% if posts %}
      {% for post in posts %}
        <tr id="cell">
          <td class="vert-align">
          <div>
            <a href="/post/{{ post.slug }}/vote?is_up=1" class="vote">
  <span class="glyphicon glyphicon-triangle-top" aria-hidden="true"></span></a>
            <br />

<span class="number" style="height:1px; font-family: 'Passion One', cursive;
"><h4 id="vote_count_{{ post.slug }}">{{ post.get_vote_count }}</h4></span>     <br>

<a href="/post/{{ post.slug }}/vote?is_up=0"  class="vote">
<span class="glyphicon glyphicon-triangle-bottom" aria-hidden="true"></span></a>
        </div>
          </td>

我下面有更多的细胞。

这是我的CSS。

.table #cell .vert-align a .glyphicon{
  font-size: 1em;
  display:inline-block;
  padding: 0em;
}
h4{
  font-size: 15px;
}

如果有人能告诉我我的js文件有什么问题,我将不胜感激。我试图在用户点击箭头箭头时更改颜色并保持更改,直到我点击该箭头或其他箭头。抱歉,如果我没有意义我现在正试图制作它(比如堆栈溢出和reddit),当我点击箭头时它会改变颜色但是当我点击其他东西时,就像一个我的网络上的空白空间颜色变了。

function vote(node) {
    var thread_id = node.attr("href").split('\/')[2];
    $.ajax({
        url: node.attr("href"),
        dataType: "json",
        success: function(data) {
            $("#vote_count_"+thread_id).html(data.count);
        },
        error: function(data) {
            alert(data.responseJSON.error_message);
        }
    });
}

$("a.vote").on("click", function() {
    vote($(this));
    return false;
});

1 个答案:

答案 0 :(得分:0)

在样式表中使用相对定位来定位箭头

position: relative; left: -5px;