Question

我制作了一个带有左边框的<div>和一个菜单栏，点击其中一个选项后，菜单就在<div>上方。

现在，当div中有文字（我需要它有文字）时，它会向左移动。

这里是代码:(我需要将文本放在第二个div）

中

<div style="position:absolute; bottom:0; top:39px; right:70%;">
   <div style="border-left:1px solid black; position:absolute; right:0px; background-color:white; top:0%; bottom:0%; height:100%; z-index:-1;">
   </div>
   <div id='settingNev' style="position:relative; top:300px;">
     <ul>
       <li id="Li1" runat="server" class="active">
          <a id="A2" runat="server"><span>Resume</span></a>
       </li>
       <li id="Li2" runat="server">
          <a id="A3" runat="server"><span>Freinds </span></a>
       </li>
     </ul>
   </div>
</div>

如何修复它以使样式相同，以便我可以在div中输入文本。（我不想拥有div width:0px;，因为这样的文字就会超出div，在this fiddle

感谢您的帮助

Answer 1

将边框放在元素的右侧？

<div style="border-right:1px solid black; position:absolute; right:0px; background-color:white; top:0%; bottom:0%; height:100%; z-index:-1;">

Answer 2

你可以使用你的最后一个解决方案，其中宽度设置为0px并修复自动换行，你可以只使用白色空间：nowrap如下：

<div style="border-left:1px solid black; position:absolute; right:0px; background-color:white; top:0%; bottom:0%; height:100%; z-index:-1; width:0px; white-space:nowrap">

演示：http://jsfiddle.net/2fDQz/84/

然而，这不是解决问题的一种非常好的方法，但你在jsfiddle中的css是如此凌乱，我不知道你做或不需要哪个css ...尝试清理你的CSS。我自己做了一个干净的版本，但可能删除了你仍然需要的css：http://jsfiddle.net/2fDQz/101/

输入文本时元素的位置会移动

2 个答案: