jQuery-UI选项卡与css float有问题 [英] jQuery-UI Tabs having problems with css float
问题描述
我的jQueryUi Tabs有问题。我想在我的选项卡视图的左侧有一个导航栏,但布局不工作。我认为这是一个错误,我会报告给jQuery,但首先我想看看你是否可以确认这是一个错误,或者我做错了什么?
I'am having a problem with jQueryUi Tabs. I want to have a navigation bar at the left side of my tabs view, but the layout is not working. I think it is a bug, and I will report it to jQuery, but first I want to see if you can confirm this to be a bug, or am I doing something wrong?
在[ http://public.virtualmischa.de/bugs/jqueryui)预览我的示例-tabslayout.html ]。
首先,您将看到非正常工作的标签示例,并低于工作标准浮动div示例。
First you see the non-working tabs example and below the working standard floating div example.
<!DOCTYPE html>
<html>
<head>
<title>JQuery Tablayout problems</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/base/jquery-ui.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#tabs").tabs();
});
</script>
</head>
<body>
<div style="float:left; width:200; color: red;height: 200px;">Where is my left bar?<br></div>
<div id="tabs"><ul><li><a href="#a1">A tab page</a></li></ul>
<div id="a1">Do you see a red bar left of this tab view?</a></div>
</div>
<div style="float:clear"></div>
<div style="float:left; width:200; color: red;height: 200px;">Where is my left bar?<br></div>
<div id="no-tabs"><ul><li><a href="#a2">A tab page</a></li></ul>
<div id="a2">Do you see a red bar left of this tab view?</a></div>
</div>
</body>
</html>
推荐答案
这里的解决方案解决了我的问题,你的。查看
jquery ui tip floated divs 。了解详情。
The solution here fixed my issue, which looks somewhat like yours. Look at jquery ui tip floated divs inside for more information.
#yourTabsDiv {
float:left;
width: 100%;
}
这篇关于jQuery-UI选项卡与css float有问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!