无法定义DIV的宽度

问题描述：

我正在制作游戏网站，并且我将DIV标签用于流派菜单。在制作菜单时，我发现我无法为菜单设置DIV元素的大小。如果有问题，我正在使用。 HTML：无法定义DIV的宽度

<div class="center"> 
    <div class="menu" onclick="location.href='all.html';">All</div> 
    <div class="menu" onclick="location.href='action.html';">Action</div> 
    <div class="menu" onclick="location.href='arcade.html';">Arcade</div> 
    <div class="menu" onclick="location.href='racing.html';">Racing</div> 
    <div class="menu" onclick="location.href='rpg.html';">PRG</div> 
    <div class="menu" onclick="location.href='skill.html';">Skill</div> 
    </div> 
    <div class="center"> 
    <div class="menu" onclick="location.href='strategy.html';">Strategy/Puzzle</div> 
    <div class="menu" onclick="location.href='shooting.html';">Shooting</div> 
    <div class="menu" onclick="location.href='sports.html';">Sports</div> 
    <div class="menu" onclick="location.href='gamegarage.html';">GameGarage</div> 
    </div>

CSS：

body 
    { 
    background-color:black; 
    color:rgb(0,255,0); 
    font-family:"Comic Sans MS"; 
    font-weight:bold; 
    } 
    .center 
    { 
    text-align:center; 
    } 
    .menu 
    { 
    font-size:1.35em; 
    display:inline; 
    width:250px; 
    cursor:pointer;cursor:hand; 
    border:5px solid #00FF00; 
    } 
    div 
    { 
    margin-bottom:15px; 
    }

有谁知道我做错了吗？感谢所有的帮助！

答

试着改变你的CSS为你的菜单标签此：

.center .menu 
{ 
font-size:1.35em; 
display:inline-block; 
width:250px; 
cursor:pointer;cursor:hand; 
border:5px solid #00FF00; 
}

你也应该改变你的onclick事件到window.location.href = "link"

答

使用

display:block

或

display:inline-block

而不是内联菜单类。

答

要解决一个div的宽度，你需要设置

.menu { 
    display: inline-block;

现在，您可以定义div的宽度，高度和垂直对齐。

width: 250px; height: 1.4em; /* height: auto inherit 130px */ 
    vertical-align: middle; 
}

如果你有一个外包装盒“.center”，那是盒装或直列盒装，但会更高的。菜单，它会在外部的中间“.center”框对齐。

无法定义DIV的宽度

相关推荐