定位仅在调试模式下才能正常工作

我正在设计一个页面。我预期的结果是把箭头样的事情底部的div像 enter image description here 定位仅在调试模式下才能正常工作

enter image description here HTML代码： <b aria-hidden="true" role="presentation" id="barrow" tabindex="-1"><bdo></bdo></b>

CSS代码： { #barrow{border: 5px solid #585858; border-top: 15px solid #E1B531; position: absolute; bottom: 68px; border-bottom: 0; margin-left: 61px; }

的问题是它不是完美的地方的地方我已经提到过。我在div1中包含了“#tag b”。当我启动代码时，箭头远离我的div1。但是，如果我去“检查元素”，它显示在确切的位置.....

为什么一个工程良好的调试，但不正常.. ???????

我已经把我的头在这几小时.....唐;知道怎么做..... 请帮我家伙出来的....

谢谢提前。

问候，维诺

来源

2014-11-25 vinoth kumar

可以共享这个问题可见小提琴？无论如何，你是否尝试过使用伪元素而不是使用空元素？ – fcalderan 2014-11-25 10:07:59

@FabrizioCalderan ...我编辑了 – 2014-11-25 10:21:03

你能用尽可能少的代码重现问题吗？这将帮助我们解决问题。您可以使用[jsfiddle.net]（http://jsfiddle.net/）或[jsbin.com]（http://jsbin.com/）等网站来显示您的示例。 – 2014-11-25 10:25:01

如果我理解正确，你 - 我会建议使用这样的事情对于箭头 - http://www.cssarrowplease.com/

它会为你生成代码，并删除您有任何错误。

像这样：

.arrow_box { 
position: relative; 
background: #88b7d5; 
border: 4px solid #c2e1f5; 
} 
.arrow_box:after, .arrow_box:before { 
top: 100%; 
left: 50%; 
border: solid transparent; 
content: " "; 
height: 0; 
width: 0; 
position: absolute; 
pointer-events: none; 
} 
.arrow_box:after { 
border-color: rgba(136, 183, 213, 0); 
border-top-color: #88b7d5; 
border-width: 30px; 
margin-left: -30px; 
} 
.arrow_box:before { 
border-color: rgba(194, 225, 245, 0); 
border-top-color: #c2e1f5; 
border-width: 36px; 
margin-left: -36px; 
}

来源

2014-11-25 10:09:40 JHair

感谢队友.......它解决了我的..... – 2014-11-25 11:47:12

定位仅在调试模式下才能正常工作

回答

相关问题