我有一个人们可以上/下投票的系统。我有两个箭头,箭头之间有一个数字。就像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;
});
答案 0 :(得分:0)
在样式表中使用相对定位来定位箭头
position: relative; left: -5px;