Hi guys,
I would like to split jQuery UI accordion in 2 columns but I cannot figure out how to do that. When I put
div style=”float:left; width:50%;”
accordion don’t work properly any more. I have been customized this demo [url]http://jqueryui.com/demos/accordion/collapsible.html
Can somebody help me please?
Thank you
[code=html]
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”utf-8″>
<title>jQuery UI Accordion – Collapse content</title>
<script src=”jquery-1.7.1.js”></script>
<script src=”ui/jquery.ui.core.js”></script>
<script src=”ui/jquery.ui.widget.js”></script>
<script src=”ui/jquery.ui.accordion.js”></script>
<script>
$(function() {
$( “#accordion” ).accordion({
collapsible: true,
animated: false,
active: false,
autoHeight: false
});
});
</script>
</head>
<body>
<div class=”demo”>
<div id=”accordion”>
<div style=”float:left; width:50%;”>
<li><a href=”#”>TITLE 1</a>
<p>TEXT 1</p></li>
<li><a href=”#”>TITLE 2</a>
<p>TEXT 2</p></li>
</div>
<div style=”float:left; width:50%;”>
<li><a href=”#”>TITLE 3</a>
<p>TEXT 3</p></li>
<li><a href=”#”>TITLE 4</a>
<p>TEXT 4</p></li>
</div>
</div><!– End accordion –>
</div><!– End demo –>
</body>
</html>