-1
次のコードでは、親のdiv content-small（緑色の色付き）の下に配置された.dropdown（灰色の色）の高さを増やそうとしています。 50pxを超えて高さを上げようとすると、何も起こりません。どうしてか分かりません。ここで私はドロップダウンメニューを練習しようとしています。絶対位置divの高さが増加しない
*{
box-sizing:border-box;
}
a {
\t color: rgba(0,0,0,1);
\t text-decoration: none; \t \t
}
a:hover {
\t color: rgba(0,0,255,1); \t
}
html,body {
\t margin: 0px;
\t height: 100%;
\t width: 100%;
\t left: 0px;
\t top: 0px;
\t background-color: rgba(0,0,0,1);
\t padding: 0px;
}
.wrapper {
\t height: 600px;
\t max-width: 960px;
\t margin-left: auto;
\t left: 0px;
\t top: 0px;
\t background-color: rgba(204,204,204,1);
\t margin-right: auto;
\t position: relative;
\t padding: 0px;
\t margin-top: 0px;
}
.content {
\t position: relative;
\t box-sizing: border-box;
\t height: 100%;
\t max-height: 200px;
\t max-width: 600px;
\t background-color: #FFF;
\t margin-right: auto;
\t margin-left: auto;
\t margin-top: 0px;
\t left: 0px;
\t right: 0px;
\t font-size: 32px;
\t text-align: center;
\t border: 3px solid rgba(0,0,0,1);
\t border-radius: 15px 15px 0px 0px;
\t width: 100%;
}
.content-small {
\t max-width: 100px;
\t height: 100%;
\t max-height: 50px;
\t background-color: rgba(0,255,204,1);
\t position: relative;
\t margin-right: auto;
\t margin-left: auto;
\t border: 3px solid rgba(0,0,0,1);
\t top: 5px;
}
.dropdown {
\t box-sizing: border-box;
\t width: 100px;
\t max-width: 100px;
\t height: 100%;
\t max-height: 50px;
\t background-color: rgba(214,214,214,1);
\t position: absolute;
\t margin-right: auto;
\t margin-left: auto;
\t border: 3px solid rgba(255,0,0,1);
\t top: 47px;
\t left: -3px;
}
\t<div class="wrapper">
<div class="content">
<div class="content-small">
Home
<div class="dropdown">
</div>
</div>
</div>
</div>
最大高さを50pxに設定するので、 – j08691
は親divまたは子divの最大高さを意味しますか？ –
@pure_coder 'dropdown' divの最大高さです。 – Dev1997