我有这套html和CSS.我想要的是必须让小的小工具块向左浮动但是在绝对定位的小工具包装器内部居中.
因此,小工具包装器绝对位于页面底部.它包含x个小工具,它们在包装器内部浮动.
所有这些小工具应该在包装器中居中 - 这是可能的,如何......?这真是让我伤心....
HTML
1
not setnot set2
not setnot set3
not setnot set
CSS
#gadget-wrapper { width: 900px; font-family: "Century Gothic"; color: #FFF; position: absolute; bottom: 10px; outline: 1px solid green; } .gadget h2 { margin: 0px; font-weight: normal; font-size: 16px; } .gadget { min-width: 120px; margin-right: 10px; padding: 5px; -webkit-border-radius: 10px; background-color: #383838; opacity: 0.75; float: left; border: 4px solid #000; } .value-holder.critical.active { color: #FF0000; } .value-holder.non-critical.active { color: #FFFF00; } .value-holder { font-size: 28px; float: left; width: 50%; text-align: center; }
Tatu Ulmanen.. 7
您是否尝试将gadget
元素内联并使用text-align将它们与中心对齐?
#gadget-wrapper { ... text-align: center; } .gadget { display: inline; float: none; }
这可能有用,我只是不确定内部的块级元素将如何表现(我现在无法测试它).您也可以尝试inline-block
代替inline
.
您是否尝试将gadget
元素内联并使用text-align将它们与中心对齐?
#gadget-wrapper { ... text-align: center; } .gadget { display: inline; float: none; }
这可能有用,我只是不确定内部的块级元素将如何表现(我现在无法测试它).您也可以尝试inline-block
代替inline
.