中不起作用。
我一辈子都无法弄清楚为什么我拥有的 float：right 没有正确显示超链接。我最初认为它不在正确的 z 索引上，但现在我只是感到困惑。有没有在某个地方阻止它？
网址 www.oakland-rotary.org我指的是网站右上角的紫色垂直块，以"您被邀请参加主要活动......"开头。应该超链接的文本是"点击这里获取信息和门票"
以下是整个块区域的 HTML 代码：
<div id="leftcall" style="float:left;width:800px;">
</div>
<div id="rightcallout">
<div style="margin-left:auto;margin-right:auto;padding-bottom:10px;"><img src="/images/smallrotarylogo.png"></div>
YOU ARE INVITED TO<br>
<span style="font-size:34px;color:#f3d825;">THE MAIN EVENT</span><br>
<br>
<span style="font-family:arial;font-size:12px;">[ OUR ANNUAL FUNDRAISER ]</span><br>
<span style="font-size:28px;color:#f3d825;">A MARDI GRAS PAR-TAY</span><br>
AT ROCKWELL WINERY<br>
IN ALAMEDA, CA<br>
<br>
<span style="font-family:arial;font-size:14px">March 1 from 6pm-10pm</span><BR>
<BR>
<span style="font-family:arial;font-size:14px;">
<a href="http://www.eventbrite.com/e/a-mardi-gras-par-tay-oakland-rotary-3-rockwall-winery-march-1-2014-tickets-5268578460" target="_blank">CLICK HERE FOR INFO & TICKETS</a>
</span>
<br>
</div>
</div>
</div>
</div>
这是该区域的 CSS：
#rightcallout {
float:right;
display:block;
z-index:9999;
height:100%;
width:200px;
padding:25px;
color:#fff;
font-family:League Gothic;
font-size:24px;
text-align:center;
background: #552baa; /* Old browsers */
background: -moz-linear-gradient(top, #552baa 0%, #5c2cb4 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#552baa), color-stop(100%,#5c2cb4)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* IE10+ */
background: linear-gradient(to bottom, #552baa 0%,#5c2cb4 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#552baa', endColorstr='#5c2cb4',GradientType=0 ); /* IE6-9 */
border-left:1px dashed #fff;
}
任何帮助将不胜感激！非常感谢！！！
此刻 #rightcallout 高度大于可用空间。我已将字体大小更改为自动...和内容正确契合。
#rightcallout {
float:right;
display:block;
z-index:9999;
height:100%;
width:200px;
padding:25px;
color:#fff;
font-family:League Gothic;
font-size:auto; /* <<<-------- Modified*/
text-align:center;
background: #552baa; /* Old browsers */
background: -moz-linear-gradient(top, #552baa 0%, #5c2cb4 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#552baa), color-stop(100%,#5c2cb4)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #552baa 0%,#5c2cb4 100%); /* IE10+ */
background: linear-gradient(to bottom, #552baa 0%,#5c2cb4 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#552baa', endColorstr='#5c2cb4',GradientType=0 ); /* IE6-9 */
border-left:1px dashed #fff;
}
对于该链接，我做了这个：
<span style="font-family:arial;font-size:14px;position: relative;z-index: 9999;">
<a href="http://www.eventbrite.com/e/a-mardi-gras-par-tay-oakland-rotary-3-rockwall-winery-march-1-2014-tickets-5268578460" target="_blank">CLICK HERE FOR INFO & TICKETS</a></span>
我已经在Chrome中进行了测试并且工作正常...希望这对你有帮助。