我正在使用ui bootstrap for angular(使用twitter bootstrap css).我能够使标签居中,但我无法弄清楚如何在标签之间添加间距(边距)(右或左).我尝试添加margin-right:100px; 在.nav-tabs> li但是没有用.
HTML:
<html>
<body>
<tabbed-Panel class="bottomTabPanel">
<!--<div data-fade="1" ngModel="activeTab" bs-Tabs>-->
<tabs>
<pane ng-repeat="pane in panes" heading="{{pane.title}}" active="pane.active">
<div ng-include src="activeContent()"></div>
</pane>
</tabs>
<!--</div>-->
</tabbed-Panel>
</div
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
CSS
.bottomTabPanel{
position:absolute;
bottom:-12px;
display:block;
background-color:#666666;
padding-left: 75px;
padding-right: 75px;
}
/*Bottom tab panel style: */
.nav-tabs>li>a {
height:73px;
width: 131px;
border: 1px solid transparent;
-webkit-border-radius: 0px 0px 0 0;
-moz-border-radius: 0px 0px 0 0;
border-radius: 0px 0px 0 0;
color: #5261ac;
font-size: 19px;
font-weight:bold;
background-color:#c2c8e4; …Run Code Online (Sandbox Code Playgroud) 我有一个GWT应用程序,我移植到GWT 2.4.现在我在这一行上弃用了警告:
historyHandler.register(placeController, eventBus, defaultPlace);
Run Code Online (Sandbox Code Playgroud)
"不推荐使用PlaceHistoryHandler类型的方法寄存器(PlaceController,EventBus,Place)"
有更好的方法可以在这里获得相同的结果,还是可以安全地忽略警告?
public void onModuleLoad()
{
// Create ClientFactory using deferred binding so we can replace with
// different impls in gwt.xml
ClientFactory clientFactory = GWT.create(ClientFactory.class);
EventBus eventBus = clientFactory.getEventBus();
PlaceController placeController = clientFactory.getPlaceController();
// Start ActivityManager for the main widget with our ActivityMapper
ActivityMapper activityMapper = new AppActivityMapper(clientFactory);
ActivityManager activityManager = new ActivityManager(activityMapper, eventBus);
activityManager.setDisplay(appWidget);
// Start PlaceHistoryHandler with our PlaceHistoryMapper
AppPlaceHistoryMapper historyMapper = GWT.create(AppPlaceHistoryMapper.class);
PlaceHistoryHandler historyHandler = new PlaceHistoryHandler(historyMapper);
historyHandler.register(placeController, eventBus, defaultPlace);
RootPanel.get().add(appWidget); …Run Code Online (Sandbox Code Playgroud) 这是我的HTML:
<ul id="sub_nav" class="block_hide trim no_list no_line" style="display: block; left: 524.5px;">
<li><a href="/path1" class="one">1st button</a></li>
<li><a href="/path2" class="one">2nd button</a></li>
<li><a href="/path3" class="one">3rd button</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
如果我现在拥有的话,我还附上了一张图片.我尝试添加display:table-cell; vertical-align:middle; 到锚标签类,但它没有工作我也尝试添加一个span锚标签与一个类:display:table-cell; vertical-align:middle; 但这也不起作用,在这两种情况下,按钮的高度并不恒定.
如何垂直居中文本并保持按钮的高度和宽度相同?
结束显示:table-cell解决方案,因为它是最交叉的浏览器....起初我不喜欢它,因为我不得不硬编码我的按钮的宽度而不是100%但是一旦我超过了这是一个坚实的解决方案:我的李:
.header #sub_nav li {
display: table;
float: left;
font-size: 11px;
line-height: 12px;
margin-bottom: 12px;
margin-left: 12px;
width: 86%;
}
Run Code Online (Sandbox Code Playgroud)
我的一个:
.header #sub_nav li a {
display: table-cell;
height: 45px;
vertical-align: middle;
width: 111px;
}
Run Code Online (Sandbox Code Playgroud)