itinfserv
asked on
ul over div
I'm using the following code to have a box with tabs.
<ul class="tabs">
<li id="basic" class="selected">
<a class="button-basic-search" href="#panel-basic-search">Basic search</a>
</li>
<li id="advanced" class="">
<span>
<a class="button-advanced-search" href="#panel-advanced-search">Advanced search</a>
</span>
</li>
</ul>
<div id="panel-basic-search" class="panel" style="display: block;">
<div class="panelBody">
<div class="panelMain">
<form id="basic-search-form" class="styled" method="get" action="/server/">
<p>Enter first name or last name to search for contacts:</p>
<label for="basic-search">Search for:</label>
<input id="basic-search" class="text" type="text" name="search_word">
<span class="button inline">
<button type="submit">Search</button>
</span>
<input type="hidden" value="ContactSearchResults" name="change">
<input type="hidden" value="simple" name="search_type">
</form>
</div>
</div>
</div>ASKER
not really, i want the selected tab not to have the bottom border so it seems it's integrated with the text box.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
One way would be to put the tabs and the panels in a container like:
<div class="tabs-container">
<!-- put tabs and panels here -->
</div>
css:
.tabs-container {
padding-top:50px;
position:relative
}
.tabs {
left:0;
position:absolute;
top:0;
}
Adjust the padding on .tabs-container to suit your design. Get the idea?