twitter-bootstrap 在 div 的角落覆盖引导标签

Overlaying bootstrap label in corner of a div

提问by JPD

I'm trying to overlay a bootstrap label in the corner of a DIV.

我试图在 DIV 的角落覆盖一个引导标签。

I'd like to put the label in the top left of the div, like a overlay so part on the div and part off.

我想将标签放在 div 的左上角，就像覆盖一样，一部分在 div 上，一部分关闭。

Thanks

谢谢

     <div class="span4" style="border-bottom: none; border-top: 4px solid #28A197;">
           <h3>Quick Links</h3>
      <div class="row">
      <div class="span2">
<div class="quickbtn">
<p><a href="#wirelessnetworkinfo" data-toggle="modal"><img src="images/icons/wirelesssignal.png" /></p>
<p>Wireless Network Information</a></p>
</div>
<br />
<div class="quickbtn">
<p><a href="http://mail.google.com" target="_blank"><img src="images/icons/gmail.png" /></p>
<p>Gmail</a></p>
</div>
      </div>

      </div>
  <span class="label label-important">UPDATED</span>

</div>  

Heres the JSFiddle of the coding etc. with example label ready for placement and the CSS for the div in question (button)

这是编码等的 JSFiddle，示例标签已准备好放置，以及相关 div 的 CSS（按钮）

回答by Mooseman

Using position: relativeon .quickbtnand position: absoluteon .quickbtn .label, you can absolutely position the label inside .quickbtn.

使用position: relativeon.quickbtn和position: absoluteon .quickbtn .label，您可以绝对将标签定位在里面.quickbtn。

Fiddle: http://jsfiddle.net/Pq6JL/1/

小提琴：http: //jsfiddle.net/Pq6JL/1/

---

---

由于您的帖子不清楚，我添加以下内容：

If you wanted the label to overhang outside of .quickbtn, set a negative topand leftfor the position of .label:

如果您希望标签悬在 之外.quickbtn，请为 的位置设置一个负数top和：left.label

.quickbtn .label {
    position:absolute;
    left: -4px;
    top: -3px
}

Fiddle: http://jsfiddle.net/Pq6JL/3/

小提琴：http: //jsfiddle.net/Pq6JL/3/