Question

我有一个我正在建设的网站。如何选择一个元素并使其向左浮动，然后向左移动？我有一个名为联系信息的项目，它应尽可能在标题下方向左移动。我的下一个元素链表应该在联系信息旁边打包，但由于某种原因不这样做。我检查了尺寸，它们非常好，所以我不明白它为什么不浮起来？

以下是HTML代码：

<html>
<head>
    ...
</head>

<body>
    <div id="header">
        A2A Luxury Taxi and Limousine <!-- background image: https://farm3.staticflickr.com/2872/12055654844_ab91e2606a.jpg -->
    </div>


    <div id = "contactinfo"> 
        <h3> Contact Us 24/7 At: </h3> 

        908-800-4727

        120 Stryker Lane, Suite 302A, Hillsborough Township NJ
    </div>

    <div id = "linklist">
        <ul>
            <li> Hours and Rates </li>
            <li> Areas of Operations </li>
            <li> About us </li>
            <li> References </li>
        </ul>
    </div>

和相应的CSS

...
#contactinfo
{
    background-image: url("..\\Images and Multimedia\\Images\\fusion2.jpg"); 
    box-shadow: 0.5em 0.5em 0.2em rgba(0,0,0,1);
    font-size: 1em;
    text-align: left;
    color:white;
    max-width:10em;
    float-left;
}
#linklist
{
    float:left;
    margin-left: auto;
    margin-right:auto;
    max-width: 45em;
    border-style: solid;
    border-color: rgba(200,200,200,0.5); 
    padding-left:0;
}

我有点惊讶，我无法找出任何修补和修复的东西。除了漂浮之外，一切都有意义。

Answer 1

在contactInfo类定义中，您有：

float-left;

而不是

float:left;

Answer 2

您的代码中有拼写错误：

#contactinfo
{
    background-image: url("..\\Images and Multimedia\\Images\\fusion2.jpg"); 
    box-shadow: 0.5em 0.5em 0.2em rgba(0,0,0,1);
    font-size: 1em;
    text-align: left;
    color:white;
    max-width:10em;
    float-left; /*<--Not good*/
}

应该是：

#contactinfo
{
    background-image: url("..\\Images and Multimedia\\Images\\fusion2.jpg"); 
    box-shadow: 0.5em 0.5em 0.2em rgba(0,0,0,1);
    font-size: 1em;
    text-align: left;
    color:white;
    max-width:10em;
    float: left; /*<-- Yay!*/
}

你应该好好追求这个

为什么我的浮子包装不正确？

2 个答案: