令人沮丧的是，我们目前正在处理的这个自定义下拉导航菜单无法解决 CSS3 伪元素“last-child”问题。
每个下拉菜单都可以分配多个列，在这种情况下，我想为 div .dropdown_3column 中的每一列 (.col_1) 应用右侧边框。
CSS 片段
.dropdown_1column_simple {width: 100px;}
.dropdown_2column_simple {width: 155px;}
.dropdown_1column {width: 550px;}
.dropdown_2column {width: 650px;}
.dropdown_3column {width: 500px;}
.dropdown_4column {width: 800px;}
.dropdown_5column {width: 1000px;}
.dropdown_2column_simple .col_1 {width:155px;}
.dropdown_2column_simple .col_2 {width:155px;}
.col_1 {width:145px; border-right: 1px solid #888;}
.col_2 {width:240px;}
.col_3 {width:490px;}
.col_4 {width:440px;}
.col_5 {width:575px;}
.col_s {width:250px;}
.col_1,.col_2,.col_3,.col_4,.col_5 {
display:inline;
float: left;
position: relative;
margin-left: 5px;
margin-right: 5px;
/*border: 1px solid #000;*/
}
HTML 片段
<div class="dropdown_3column align_left ">
<div class="col_3">
<div class="content_top"></div>
</div>
<div class="col_1">
<ul>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/addict-clothing.html">
<span class="level1">Addict Clothing </span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/atticus-clothing.html">
<span class="level1">Atticus Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/dephect-clothing.html">
<span class="level1">Dephect Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/dickies-clothing.html">
<span class="level1">Dickies</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/dta-clothing.html">
<span class="level1">DTA Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/famous-stars-and-straps-clothing.html">
<span class="level1">Famous Stars And Straps Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/fuct-clothing.html">
<span class="level1">FUCT Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/hex-accessories.html">
<span class="level1">HEX Accessories</span>
</a>
</li>
</ul>
</div>
<div class="col_1">
<ul>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/the-hundreds.html">
<span class="level1">The Hundreds</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/insight-clothing.html">
<span class="level1">Insight Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/jeepney-clothing.html">
<span class="level1">Jeepney Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/king-apparel.html">
<span class="level1">King Apparel</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/lrg-clothing.html">
<span class="level1">LRG Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/my-yard-clothing.html">
<span class="level1">My Yard</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/new-era-5950.html">
<span class="level1">New Era 5950 Hats and Apparel</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/pxl-clothing.html">
<span class="level1">PXL Clothing</span>
</a>
</li>
</ul>
</div>
<div class="col_1">
<ul>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/rebel8-clothing.html">
<span class="level1">REBEL8 Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/ringspun-clothing.html">
<span class="level1">Ringspun</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/rogue-status-clothing.html">
<span class="level1">Rogue Status </span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/the-wild-ones-clothing.html">
<span class="level1">The Wild Ones</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/volcom-clothing.html">
<span class="level1">Volcom Clothing</span>
</a>
</li>
<li class="level1">
<a href="http://009rep.clubnetdev.com/brands/zoo-york-clothing.html">
<span class="level1">Zoo York Clothing</span>
</a>
</li>
</ul>
</div>
<div class="col_3">
<div class="content_bottom"></div>
</div>
<div class="col_s">
<div class="content_side"></div>
</div>
</div>
可以在此处查看该问题的实时版本。我正在尝试从第三（最后）列中删除右侧边框，这是有问题的“品牌”下拉列表。
我知道浏览器不兼容和其他使用 JS / jQuery 的替代方案可能存在，但我只对尝试使用 CSS 解决这个问题感兴趣。
我在想也许这需要一双新的眼睛，因为我已经尝试了很多变化，但没有设法选择我相信的下拉列表中的最后一列。
提前致谢。
编辑：我尝试了很多变化，但我认为问题是我无法计算出父项的最后一个子项，它也不算其他 div。我一直在尝试以下方法：
div:last-child .col_1 {border-right: none !important;}
谢谢。
编辑 2：如果它对任何人有帮助，请在JS Fiddle上找到我的问题实例。
谢谢。