将 Jquery Raty 插件与文本正确对齐答案

【问题标题】：Align Jquery Raty plugin properly with text将 Jquery Raty 插件与文本正确对齐
【发布时间】：2013-04-03 17:51:56
【问题描述】：

我目前正在开发一个预约安排系统，该系统有一个留给实践的评论部分。我正在使用 Jquery Rate 插件根据用户提交的反馈填充星星。我已经尝试了所有可能的方法来将星星与文本和图像对齐。请看附件截图：

我正在尝试让“等待时间”下的星星与我的图像对齐。图片是这样添加到这个页面的：

<%= image_tag("review_img_03.png",style:"margin:0px 4px 0px 4px;vertical-align:text-top") %>

有人可以指出我应该如何实现这一目标的正确方向吗？我已经尝试了 CSS 中的每一件事来实现这一点，但它们都不起作用。

任何帮助将不胜感激。

【问题讨论】：

@Adrift：伙计，我猜你误解了我的问题。我没有任何CSS。这是 jquery raty 插件的简单原始实现，我想自定义它以显示在“等待时间”下方，而不是出现在图像下方。希望现在有意义吗？

【解决方案1】：

我的朋友遇到了同样的问题，找到了解决方法。请注意，如果您的网站允许动态文本大小（或者如果用户在浏览器上更改文本大小），那么这更像是一种破解而不是修复，那么它可能会出现偏差。

在实际的 jRate div（或任何你有的）上，使用 vertical-align 属性稍微调整它。出于我的目的：

#jRate {
      vertical-align: -3px;
}

像魅力一样工作。

支持所有浏览器。

【讨论】：

【解决方案2】：

您是否尝试过使用绝对定位？

Style = "position:absolute; top:-5px;left:15px;"

只需调整顶部和左侧的值即可获得所需的星号。

如果将位置设为绝对，则父元素必须具有 position = relative。否则星星将与页面正文对齐。

【讨论】：