边框不见了答案

【问题标题】：Border is missing边框不见了
【发布时间】：2013-03-23 02:03:06
【问题描述】：

我不知道为什么没有显示边框。我有一个封装所有元素的主包装器；我只是将每个元素的背景设置为透明的白色，然后在包装器中添加一个透明的白色边框。

/* Wrapper - Main *********/    
.main_wrapper{ 
        display:block;
        background: rgba(255,0,0,.5);
        width:1000px;
        height: 2000px;
        margin-left:18%;
        margin-top:7%;
        border:10px;
        border-color: rgba(255,255,255,.5);
}

html

<div class="main_wrapper">

<!-- Logo _____________________________________________________-->

<div class="logo">
    <a href="index.html"><img alt="emma carmichael" height="150px"
            src="images/Home/emma-logo.png"></a>
</div>

<!---Navigation Menu ______________________________________________-->

    <div id="main_menu" class="wrapper_nav_box">
        <div class="nav_box">
            <a href="writing.html">WRITING</a> 
        </div>
        <div class="nav_box">
            <a href="http://tumblr.com">BLOG</a>
        </div>
        <div class="nav_box">
            <a href="contact.html">CONTACT</a>
        </div>
    </div>

有什么想法吗？

【问题讨论】：

border: 10px solid red; 按预期工作。尝试 firebug 或其他调试工具。我认为您错过了“solid”关键字。

标签： css border

【解决方案1】：

作为@Lotus said：

你忘了包含边框样式

作为 Lotus 建议的使用速记的替代方法，您可以这样做：

.main_wrapper
{ 
    /*other stuff*/
    border-width: 10px;
    border-style: solid;
    border-color: rgba(255,255,255,.5);
}

注意：我添加这个以扩展 Lotus 的答案，并帮助回答 @Claire 的 comment“我知道我应该使用速记，但为什么不使用其他方式工作吗？”

【讨论】：