html - 页脚中包含的 div 中的文本对齐方式

Question

我无法将页脚中的文本放在正确的位置，如下图所示:

我一直在对模板中的代码进行更改，现在文本位于上部并且出现了一些空白点，特别是在 Chrome 浏览器上:

网页是here这些是 html 的链接和 css

更新:JSFiddle添加。

<footer class="aligncenter">
    <div class="wrapper" id="bottom_footer">
         <h2 class="hidden">xxxx Footer</h2>

        <section>
            <div class="left_column">
                 <h4>OFICINAS CENTRALES</h4>

                <p>xxxxxxx xxxx, 35</p>
                <P>xxxx x</p>
                <p>Tlfo xxxxx Fax xxxx</p>
            </div>
            <!-- left_column-->
            <div class="mid_column"><span class="helper"></span>
                <img src="images/eccWhite_200.png" width="400" height="120" />
            </div>
            <div class="right_column">
                 <h4> xxxxx ESTRUCTURAS SL</h4>

                <p>estructuras construcciones y contratas</p>
                <p>info@xxxx</p>
            </div>
            <!--right_column-->
        </section>
        <!-- class="container"-->
    </div>
    <!-- wrapper footer-->
</footer>

你能告诉我我做错了什么吗？

Answer 1

我建议不要在左侧和中间列上使用 float:left;。由于您的内容不太可能发生重大变化，因此我可能会做一件事。给你的页脚 position:relative 并用 position:absolute; 定位你的 .right-column;底部:0；右:0；。这将确保您的右侧列位于最右侧，并与页脚底部对齐。

总的来说，页脚中的样式似乎试图成为“不是表格”，但最终变得有些困惑。如果您想要仍然像表格一样运行的语义标记，请尝试 http://960.gs/ .