css - 获取文本以移至新列

Question

我正在尝试获取页脚区域位置和时间中的文本，以便为每个办公室创建两列。我试图使用高度设置将它 float 到左侧，但它没有创建两列。有人可以告诉我我做错了什么吗？

您可以在此处找到该站点...

http://jsfiddle.net/ggJvM/

** Fiddle 可能挂了 **

我希望在自己的栏中同时包含办公时间和工作时间。

这是我遇到问题的脚本和 CSS 区域。

<div id="footer"><div class="content">
        <ul class="left">
            <li class="Footerbullets"><a href="default.php">HOME</a></li>
            <li class="Footerbullets"><a href="practiceareas.php">PRACTICE AREAS</a></li>
            <li class="Footerbullets"><a href="attorneyprofiles.php">ATTORNEY PROFILES</a></li>
            <li class="Footerbullets"><a href="blog.php">BLOG</a></li>
            <li class="Footerbullets"><a href="locations.php">LOCATIONS &amp; HOURS</a></li>
            <li class="Footerbullets"><a href="contactus.php">CONTACT US</a></li>
        </ul>
        <ul class="center">
            <li class="Footerbullets">CURRENT NEWS</li>
            <li>&nbsp;</li>
        </ul>
        <ul class="right">
            <li class="Footerbullets">LOCATION &amp; HOURS</li>
            <li style="padding:3px 0 3px 25px;">Atlantic County Office:</strong><br>
    210 New Road, Suite 12<br>
    Linwood Greene<br>
    Linwood, New Jersey 08221<br>
    Phone: (609) 601-8677<br>
    Fax: (609) 601-8577<br><br>

    <strong>Office Hours:</strong><br>
    Monday - Friday: 08:30 AM-5:00 PM<br>
    Saturday: 10:00 AM-12:30 PM<br>
    Other hours by appointment<br />
     <br />
    <strong>Camden County Office:</strong><br>
    1939 Route 70 East, Suite 100<br>
    Cherry Hill, New Jersey 08003<br>
    Phone:(856) 874-0555<br>
    Fax: (856) 874-9683<br><br>

    <strong>Office Hours:</strong><br>
    Monday - Friday: 08:30 AM-5:00 PM<br>
          Saturday: 10:00 AM-12:30 PM<br>
         Other hours by appointment</li>
        </ul>
     </div></div>

这是该区域的部分 CSS

#footer .content {
border-bottom: 1px #fff dotted;
border-top: 1px #fff dotted;
width: 960px;
height: 135px;
position: relative;
margin-right: auto;
margin-left: auto;
padding-top: 10px;
padding-bottom: 10px;
color:#FFF;
}
#footer ul{
float: left;
width: 319px;
height: 135px;
border-right: 1px #fff dotted;
color:#FFF;
 }
#footer ul:last-child {
border-right: none;
}

#footer {
background: #4D1516;
margin-top: -200px;
z-index: 1;
position:relative;
padding-top: 220px;
padding-bottom: 100px;
color:#FFF;
font-weight:bolder;
}

div#footer ul li a{
color : #115EAC;
background-color : transparent;
text-decoration : none;
color:#FFF;
}
 div#footer ul li a:hover{
text-decoration : underline;
}
.Footerbullets{
padding:3px 0 3px 25px;
background-image:url(http://www.gdisinc.com/barker/images/menubar/footer_bullet.jpg);
background-repeat:no-repeat;
}
.Footerbullets a:link {
   color:#FFF;
 }
div#footer ul li.Footerbullets a:hover {
    color:#FF0;
 }

 /* Footer column sizes. */
#footer ul.left {
width: 20%;
 }

 #footer ul.center {
width: 40%;
 }

 #footer ul.right {
float: left;
width: 37%;
  }

Answer 1

你想要这个吗:http://jsfiddle.net/ggJvM/1/ ？

CSS:

.locationHours{
    overflow:hidden;
}
.locationHours>div{
    float:left;
    width:50%;
}
#footer .content,#footer ul{
    height:auto;
    overflow:hidden;
}

HTML:

<li class="locationHours">
    <div>
        <strong>Atlantic County Office:</strong><br>
        210 New Road, Suite 12<br>
        Linwood Greene<br>
        Linwood, New Jersey 08221<br>
        Phone: (609) 601-8677<br>
        Fax: (609) 601-8577<br><br>

        <strong>Office Hours:</strong><br>
        Monday - Friday: 08:30 AM-5:00 PM<br>
        Saturday: 10:00 AM-12:30 PM<br>
        Other hours by appointment<br />
    </div>
    <div>
        <strong>Camden County Office:</strong><br>
        1939 Route 70 East, Suite 100<br>
        Cherry Hill, New Jersey 08003<br>
        Phone:(856) 874-0555<br>
        Fax: (856) 874-9683<br><br>

        <strong>Office Hours:</strong><br>
        Monday - Friday: 08:30 AM-5:00 PM<br>
        Saturday: 10:00 AM-12:30 PM<br>
                    Other hours by appointment
    </div>
</li>