Question

我试图纠正这个问题的时间太长了，而且没有到达任何地方。

我试图在父div中使用text-align：justify水平对齐三个内联块div，但没有运气。我过去做过类似的事情，我已经读过其他线索，说明我正确的做法。

我正在尝试学习codeIgniter框架，但不确定它是否相关。

我也是第一次使用Aptana。再次，不确定这是否有任何影响（无法看到它会如何）。

也许解决方案就在我面前，但任何帮助都会受到赞赏。感谢。

HTML：

<div about="homeContent" class="pageContent">
    <h1>Home</h1>
    <div id="threeColumn" class="threeColumnDiv"> <!--Define id and class-->
        <div id="One" class="threeColumnElement">
        </div>
        <div id="Two" class="threeColumnElement">
        </div>
        <div id="Three" class="threeColumnElement">
        </div>
    </div>
</div>

CSS：

html, body{
    height: 100%;
}

html{   
}

body {
    margin: 0px;
}



#wrapper{
    width: 960px;
    margin: 0px auto;
    min-height: 100%;
}


/****HEADER*****/

#headerBanner{
    height: 100px;
    width: 960px;
    background-color: green;
}

#leftHeaderBanner{
}

#rightHeaderBanner{
}

/****Home****/



#threeColumn{
    text-align: justify;
}


#One{
    display: inline-block;
    width: 100px;
    height: 100px;
    background-color: blue;


}

#Two{
    display: inline-block;
    width: 100px;
    height: 100px;
    background-color: blue;
}

#Three{
    display: inline-block;
    width: 100px;
    height: 100px;
    background-color: blue;
}




/****FOOTER****/
/***STICKY FOOTER FROM http://www.cssstickyfooter.com/using-sticky-footer-code.html*/

#footerBanner{
    width: 960px;
    background-color: blue;
    margin: 0px auto;
    position: relative;
    margin-top: -150px; /* negative value of footer height */
    height: 150px;
    clear:both;
}

#leftFooterBanner{
}

#rightFooterBanner{
}

Answer 1

在auto do_somthing=[](iterator beg,iterator end){ //code here }

中使用text-align:center代替text-align: justify;

#threeColumn

Working Fiddle

三个div，水平对齐

1 个答案: