0

在此处输入图像描述我给这个 div 向左浮动，但它没有向左移动到它上面的 div .....

欢迎和邮件 ID 应与公司徽标 div 相邻。...

每个 div 应该水平对齐

http://jsfiddle.net/TdcRJ/7/

 <div style="float: left;">
                        <p>welcome xyz! xyz@defie.co</p>
                    </div>
providing my code below

<div style="
    display: inline-block;
">
                    <a class="brand" href="&lt;?= HOME_URL ;?&gt;" style="">
                    Company LOGO
                    </a>
                </div>
                <div style="clear: left;">
                    <p>47657 Lakeview Blvd</p>
                    <p>Fremont CA 94538</p>
                    <p>510-657-8981</p>
                </div>

                <div style="float: left;">
                    <p>welcome xyz! xyz@defie.co</p>
                </div>

                <div class="inline" style="padding-top: 12px;">

                        <ul class="homePageLists" style="">
                            <li style="padding-bottom: 5px; list-style: none; color: #333;">
                                <a style="color: #333;" href="http://www.w3schools.com/" target="_blank">
                                  <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_menu.png">
                                   Menu
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #; ">
                                <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                  <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                  Inventory
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #653921; ">
                                <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                  <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                  BOM List
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #653921; ">
                                <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                    <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                    Sub BOM List
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #9e1c20; ">
                                <a style="color: #9e1c20;" href="http://www.w3schools.com/" target="_blank">
                                    <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_product.png">
                                    Product
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #ff5100; ">
                                <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank">
                                    <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_customer.png">
                                    Customer List
                                </a>
                            </li>
                            <li style="padding-bottom: 5px; list-style: none; color: #184179;">
                                <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank">
                                    <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_vender.png">
                                    Vendor List
                                </a>
                            </li>
                        </ul>

                </div><!--/.nav-collapse -->
4

3 回答 3

1

在这种情况下，您必须按 div 排列 div。为每个 div 提供一个浮点数。并为每个 div 设置一个高度和 with。之后，将此 div 包含在另一个主 div 中。我将很快包含 jsfiddle

于 2013-02-12T04:58:16.830 回答
0

增加导航栏的宽度，然后它会从左到顶 div

于 2013-02-12T04:45:57.803 回答
0

试试这个

    <div class="companyLogo" style="width: 1009px;">
    <div style="width: 400px;height: 120px;">
    <div style="float:right;margin-top: -8px;">
    <a class="brand" href="&lt;?= HOME_URL ;?&gt;" style="">
        Company LOGO
        </a>

    <div style="clear: left;">
    <p>47657 Lakeview Blvd</p>
    <p>Fremont CA 94538</p>
    <p>510-657-8981</p>
    </div></div>

    <div style="float: left;">
    <p>welcome xyz! xyz@defie.co</p>
    </div>
    </div>
   <div class="inline" style="padding-top: 12px;">

    <ul class="homePageLists" style="">
     <li style="padding-bottom: 5px; list-style: none; color: #333;">
     <a style="color: #333;" href="http://www.w3schools.com/" target="_blank">
   <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_menu.png">
                                       Menu
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #; ">
                                    <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                      <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                      Inventory
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #653921; ">
                                    <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                      <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                      BOM List
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #653921; ">
                                    <a style="color: #653921;" href="http://www.w3schools.com/" target="_blank">
                                        <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_inventory.png">
                                        Sub BOM List
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #9e1c20; ">
                                    <a style="color: #9e1c20;" href="http://www.w3schools.com/" target="_blank">
                                        <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_product.png">
                                        Product
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #ff5100; ">
                                    <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank">
                                        <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_customer.png">
                                        Customer List
                                    </a>
                                </li>
                                <li style="padding-bottom: 5px; list-style: none; color: #184179;">
                                    <a style="color: #ff5100;" href="http://www.w3schools.com/" target="_blank">
                                        <img alt="squareList" style="margin-right: 10px;" id="logo" src="http://intra.defie.co/images/cube_vender.png">
                                        Vendor List
                                    </a>
                                </li>
                            </ul>

                    </div><!--/.nav-collapse -->

                    <div>
                        <p>ABC Systems</p>
                        <p>1234 lakeview Blvd</p>
                        <p>CA 94538</p>
                        <p>510-657-8981</p>
                    </div>


                </div>
于 2013-02-12T05:21:06.937 回答