I'm currently developing a webapp in .net and utilizing some of the AJAX features, specifically TabContainer. I'm facing an issue with aligning the "Update PCR" button right underneath the "Disciplines Affected" tab on the tab's content side. Since both the left menu and the right content belong to the same block, which is TabContainer, I'm struggling to figure out how to format the CSS for the button placement. Adding the button as part of the menu would require setting the control to AutoPostback, which isn't ideal in this case.
Any suggestions on how to adjust the CSS to position the Button below TabContainer's menu would be greatly appreciated!
EDIT:
Below is the current CSS snippet:
.ajax_tabController .ajax__tab_tab
{
background-color: #3c6f91;
padding: 5px;
border: 1px solid #ffffff;
color:#ffffff;
border-left: 3px solid #5AB0DB;
}
.ajax_tabController .ajax__tab_hover .ajax__tab_tab
{
background-color:#5AB0DB;
text-decoration:none;
}
.ajax_tabController .ajax__tab_active .ajax__tab_tab
{
background-color:#5AB0DB;
text-decoration: underline;
}
Additionally, there's CSS code that modifies the settings to make TabContainer Vertical instead of Horizontal. Although there is a property called .UseVerticalStripPlacement, it disrupts the control's height and triggers a JavaScript error.
.ajax__tab_header
{
float: left;
}
.ajax__tab_body
{
margin-left: 160px;
}
.ajax__tab_outer
{
display: block !important;
}
.ajax__tab_tab
{
width: 210px;
height: auto !important;
}