新しいサイトを構築し、ニュース ティッカーに取り組んでいるため、その下にナビゲーション用のハッシュ マークが表示されています。ハッシュ マークは、ティッカー モジュールの下部にある絶対 div にあります。div 内にはアンカー タグといくつかのスペーサーがあり、本来あるべき場所より下にレンダリングされており、その理由を特定できないようです。誰か見て助けてもらえますか?
http://race.3drexstaging.com/Home がリンクです。
助けてくれてありがとう
HTML
<div class="dnnForm Normal NewsFeedHolder">
<div class="newsFeedInner">
<div class="feedItems" id="newsItem0">
<span class="feedTitles">Featured Promotions : </span>
<span class="feedTexts">Example - 50% OFF SALE! On Select Products and Services</span>
</div>
<div class="feedItems inactive active" id="newsItem1">
<span class="feedTitles">Another Headline : </span>
<span class="feedTexts">You can put info about another sale here</span>
</div>
<div class="feedItems inactive" id="newsItem2">
<span class="feedTitles">Yet Another Headline : </span>
<span class="feedTexts">More information about your sale</span>
</div>
</div>
<div class="newsFeedNavs">
<div class="newsFeedNavsInner">
<a class="newsNavItems" id="newsNavItem0" href="javascript:getNewsItem(0)"></a>
<span class="newsSpacer"></span>
<a class="newsNavItems inactive active" id="newsNavItem1" href="javascript:getNewsItem(1)"></a>
<span class="newsSpacer"></span>
<a class="newsNavItems inactive" id="newsNavItem2" href="javascript:getNewsItem(2)"></a>
</div>
</div>
</div>
現在の CSS:
.feedItems
{
color: white;
}
.feedTitles
{
font-weight: bold;
color: #ce0d25;
margin-right: 10px;
}
.feedTexts
{
}
.NewsFeedHolder
{
position: relative;
}
.newsFeedInner
{
padding-top: 15px;
padding-bottom: 15px;
text-align: center;
font-size: 10pt;
}
.newsFeedNavs
{
text-align: center;
position: absolute;
height: 2px;
bottom: -2px;
left: 0px;
right: 0px;
}
.newsFeedNavsInner {
height: 2px;
display: inline-block;
background-color: black;
padding-right: 15px;
padding-left: 15px;
}
.newsNavItems
{
display: inline-block;
width: 15px;
height: 2px;
overflow: hidden;
text-indent: -9999px;
background-color: white;
line-height: 2px;
margin: 0px;
padding: 0px;
}
a.newsNavItems:hover, a.newsNavItems.active
{
background-color: red;
}
.feedItems
{
display: none;
}
.feedItems.active
{
display: block;
}
.newsSpacer {
display: inline-block;
width: 15px;
line-height: 2px;
height: 2px;
margin: 0px;
padding: 0px;
}