Question

我正在尝试创建一个包含h1和选择列表的基本标题栏div。我希望选择列表位于div的最右侧，但是向右浮动它不起作用。有没有人有任何想法？代码非常简单但无法查看错误的位置。谢谢！

<style type="text/css">
#select {
float: right;
}
h1 {
display: inline;
}
#titleBar {
width: 800px;
}
</style>

<body>
<div id="titleBar"><h1>Select Your Car </h1>
    <select name="categories">
          <option value="volvo">Volvo</option>
          <option value="saab">Saab</option>
          <option value="mercedes">Mercedes</option>
          <option value="audi">Audi</option>
    </select>
</div>
</body>

这是jsfiddle的链接：http://jsfiddle.net/qhvDG/1/

Answer 1

您的风格不正确，应如下所示，因为#代表元素的ID，select是代码名称而不是ID。

select {
  float: right;
}

或者更好，但更像是这样的描述性：

div#titleBar > select {
  float: right;
}

以下是一个示例小提琴http://jsfiddle.net/qhvDG/3/

Answer 2

CSS中的“select”是ID，而不是元素名称。只需从#select中删除＃符号。

Answer 3

尝试在您的风格中使用“select”而不是#select。

  select {
float: right;
}

选择框不向右浮动

3 个答案: