html - 试图在我的 css 中定位一个类

Question

我正在尝试在我的 CSS 中定位一个类以沿侧面移动，因此它看起来像一个侧面导航。我似乎无法瞄准它，我正在用边框测试它并移动它，但似乎无法得到它。任何帮助，将不胜感激。

这是html

<div class="sidebarContainer">
<div id="sidebar" class="tabbed-sidebar">
    <!-- The tabs -->
    <ul class="sidebar-tabs">
        <li id="t1" class="sidebar-tab t1"><a class="sidebar-tab t1" title="Tab 1">Tab 1</a></li>
        <li id="t2" class="sidebar-tab t2"><a class="sidebar-tab t2" title="Tab 2">Tab 2</a></li>
        <li id="t3" class="sidebar-tab t3"><a class="sidebar-tab t3" title="Tab 3">Tab 3</a></li>
        <li id="t4" class="sidebar-tab t4"><a class="sidebar-tab t4" title="Tab 4">Tab 4</a></li>
        </ul>
            <!-- tab 1 -->
            <div class="sidebar-tab-content sidebar-tab-content-t1"> <--This is what i am trying to target to go along the side of.... the sidebar-tabs                    
                <ul>
                    <li>List item</li>
                    <li>List item</li>
                    <li>List item</li>
                    <li>List item</li>
                    <li>List item</li>
                </ul>
            </div>

  <!-- tab 2 -->
  <div class="sidebar-tab-content sidebar-tab-content-t2">
      <p>what sup.</p>
  </div>

这是CSS

#sidebar >  .sidebar-tab-content sidebar-tab-content-t1 ul {
    position:relative;
    border:5px solid red;
    left:200px;
}

Answer 1

你的问题是这样的:

#sidebar >  .sidebar-tab-content sidebar-tab-content-t1 ul {

这假设 .sidebar-tab-content 是 #sidebar 的直接子级(因为 >)，但事实并非如此，而且 sidebar-tab-content-t1 是一个标签(而不是同一元素上的类，因为它缺少 .)和 .sidebar 的后代-tab-content 这也是不正确的，因此请尝试将您的选择器更改为:

#sidebar .sidebar-tab-content.sidebar-tab-content-t1 ul {

或者:

#sidebar .sidebar-tab-content.sidebar-tab-content-t1 > ul {