This is a migrated thread and some comments may be shown as answers.

css formating when ajaxmanager set to control

1 Answer 111 Views

Ajax

This is a migrated thread and some comments may be shown as answers.

Daniel asked on 28 Apr 2011, 09:58 PM

I am having a problem when the ajaxmanger is set to my panel control my css formating gets messed up.
I have set UpdatePanelsRenderMode=inline but that does help.

You can see this in action at http://simplyfundraising.ageektech.com/
username test123
pass test#123

Click on the Campaigns menu button and you will see the grid flash to the right of the tree menu then
move down to the bottom and partial css is lost. The treeview losses css and the grid should be to the
right of the treeview. If I remove all controls from the ajaxmanager the

Public Class Main

Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

'Load default control

If Not IsPostBack Then

LoadUserControl("~/webapplication/member/DashBoard.ascx")

End If

End Sub

Protected Sub RadMenu1_ItemClick(sender As Object, e As Telerik.Web.UI.RadMenuEventArgs) Handles RadMenu1.ItemClick

Me.Panel1.Controls.Clear()

If e.Item.Text = "Campaigns" Then

LoadUserControl("~/webapplication/admin/CampaignList.ascx")

ElseIf e.Item.Text = "Contributors" Then

LoadUserControl("~/webapplication/member/ContributorList.ascx")

ElseIf e.Item.Text = "Employees" Then

LoadUserControl("~/webapplication/admin/EmployeeList.ascx")

ElseIf e.Item.Text = "Events" Then

LoadUserControl("~/webapplication/member/EventList.ascx")

ElseIf e.Item.Text = "Tasks" Then

LoadUserControl("~/webapplication/member/TaskList.ascx")

ElseIf e.Item.Text = "Donations" Then

LoadUserControl("~/webapplication/member/DontationList.ascx")

End If

End Sub

Public Sub LoadUserControl(ByVal controlName As String)

Dim userControl As UserControl = CType(Me.LoadControl(controlName), UserControl)

Me.Panel1.Controls.Add(userControl)

End Sub

End Class

css layout renders correctly. Panel1 is my target control
I am using loadcontrol on Panel1 to load ascx RadGrid controls

Thank you.

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Main.aspx.vb" Inherits="SimplyFundraisingWeb2.Main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

<title></title>

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />

</head>

<body>

<form id="form2" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<telerik:RadCodeBlock ID="rcb1" runat="server">

<script src="<%=ResolveClientUrl("~/webapplication/js/utils.js")%>" type="text/javascript"></script>

<script src="<%=ResolveClientUrl("~/webapplication/js/script.js")%>" type="text/javascript"></script>

</telerik:RadCodeBlock>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" UpdatePanelsRenderMode="Inline" >

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadComboBox1">

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadMenu1" >

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadTreeView1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Panel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div id="art-main">

<div class="art-header">

<div class="art-header-clip">

<div class="art-header-center">

<div class="art-header-png">

</div>

<div class="art-header-jpeg">

</div>

<div class="art-header-wrapper">

<div class="logininfo">

<asp:Label ID="lbltoday" runat="server" Text="Label"></asp:Label>

| Howdy,

<asp:LoginName ID="LoginName1" runat="server" />

|

<asp:LoginStatus Style="color: orange" ID="LoginStatus1" runat="server" />

|

<asp:HyperLink Style="color: orange" ID="lnkTotalRegisteredUsers" NavigateUrl="~/admin/users-a-z.aspx?az=%"

runat="server" ToolTip="The total number of registered users">

Registered:<asp:Label Style="color: orange" runat="server" ID="lblTotalUsers" />

</asp:HyperLink> | <asp:HyperLink Style="color: orange" ID="lnkTotalUsersOnline" NavigateUrl="~/admin/online-users.aspx"

runat="server" ToolTip="The number of users currently visiting the site">

Online:<asp:Label runat="server" ID="lblOnlineUsers" />

</asp:HyperLink> | <asp:HyperLink Style="color: yellow" ID="lnkUserAdministration" NavigateUrl="~/admin/default.aspx"

runat="server" ToolTip="User Administration page">

User Administration<asp:Label runat="server" ID="Label1" />

</asp:HyperLink></div><div class="art-header-inner">

<div class="art-headerobject">

</div>

<div class="art-logo">

<h1 class="art-logo-name">

<a href="DashBoard.aspx"><a href="DashBoard.aspx"> Simply Fundrasing</a></h1><h2 class="art-logo-text">

Helping you meet your goal</h2></div></div></div></div><div class="cleared reset-box">

</div>

<div class="art-nav">

<div class="art-nav-l">

</div>

<div class="art-nav-r">

</div>

<div class="art-nav-outer">

<div class="campaign">

<telerik:RadComboBox ID="RadComboBox1" runat="server" DataSourceID="dsCampaigns"

DataTextField="Name" DataValueField="ID">

</telerik:RadComboBox>

Choose Campaign: </div><div class="art-nav-wrapper">

<div class="art-nav-inner">

<telerik:RadMenu ID="RadMenu1" runat="server" Style="top: 8px; left: 20px">

<Items>

<telerik:RadMenuItem runat="server" Text="Campaigns">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Contributors">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Donations">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Employees">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Events">

</telerik:RadMenuItem>

<telerik:RadMenuItem runat="server" Text="Tasks">

</telerik:RadMenuItem>

</Items>

</telerik:RadMenu>

</div>

<div class="cleared reset-box">

</div>

<div class="art-sheet">

<div class="art-sheet-tl">

</div>

<div class="art-sheet-tr">

</div>

<div class="art-sheet-bl">

</div>

<div class="art-sheet-br">

</div>

<div class="art-sheet-tc">

</div>

<div class="art-sheet-bc">

</div>

<div class="art-sheet-cl">

</div>

<div class="art-sheet-cr">

</div>

<div class="art-sheet-cc">

</div>

<div class="art-sheet-body">

<div class="art-content-layout">

<div class="art-content-layout-row">

<div class="art-layout-cell art-sidebar1">

<div class="art-block">

<div class="art-block-body">

<div class="art-blockheader">

<div class="l">

</div>

<div class="r">

</div>

<h3 class="t">

Dashboard Menu </h3></div><div class="art-blockcontent">

<div class="art-blockcontent-tl">

</div>

<div class="art-blockcontent-tr">

</div>

<div class="art-blockcontent-bl">

</div>

<div class="art-blockcontent-br">

</div>

<div class="art-blockcontent-tc">

</div>

<div class="art-blockcontent-bc">

</div>

<div class="art-blockcontent-cl">

</div>

<div class="art-blockcontent-cr">

</div>

<div class="art-blockcontent-cc">

</div>

<div class="art-blockcontent-body">

<telerik:RadTreeView ID="RadTreeView1" runat="server" ShowLineImages="false" ExpandDelay="0"

OnClientNodeClicking="onNodeClicking">

<Nodes>

<telerik:RadTreeNode runat="server" Text="My Dashboard" NavigateUrl="DashBoard.aspx">

<Nodes>

<telerik:RadTreeNode runat="server" Text="Assigned Calls">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Pending Tasks">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="UnPaid Pledges">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Upcoming Events">

</telerik:RadTreeNode>

</Nodes>

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Campaign">

<Nodes>

<telerik:RadTreeNode runat="server" Text="Add Contributor">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Add Donation">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Add Task">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Add Event">

</telerik:RadTreeNode>

</Nodes>

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Global">

<Nodes>

<telerik:RadTreeNode runat="server" Text="Add Campaign">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Add Employee">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="View Campaigns">

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="View Employees">

</telerik:RadTreeNode>

</Nodes>

</telerik:RadTreeNode>

<telerik:RadTreeNode runat="server" Text="Reports">

</telerik:RadTreeNode>

</Nodes>

</telerik:RadTreeView>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="art-layout-cell art-content">

<asp:Panel ID="Panel1" runat="server">

</asp:Panel>

<div class="art-post">

<div class="art-post-body">

<div class="art-post-inner art-article">

<div class="art-postcontent">

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="art-footer">

<div class="art-footer-t">

</div>

<div class="art-footer-l">

</div>

<div class="art-footer-b">

</div>

<div class="art-footer-r">

</div>

<div class="art-footer-body">

<div class="art-footer-text">

<p>

<a href="#">

Link1ooter-r">t-footer-r">

</div>

<div class="art-footer-body">

<div class="art-footer-text">

<p>

<a href="#">

Link1ooter-r"></div>

<div class="art-footer-body">

<div class="art-footer-text">

<p>

<a href="#">Link1</a> | <a href="#">Link2</a> | <a href="#">Link3</a></p>

<p>

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<div class="cleared">

</div>

<p class="art-page-footer">

<a href="http://www.artisteer.com/?p=website_templates">Website Template</a> created

with Artisteer.</p>

</div>

<asp:SqlDataSource ID="dsCampaigns" runat="server" ConnectionString="<%$ ConnectionStrings:CharitableContributionsConnectionString %>"

SelectCommand="SELECT [Name], [ID] FROM [Campaigns]"></asp:SqlDataSource>

</form>

</body>

</html

>




/* begin Page */
/* Created by Artisteer v3.0.0.38499 */
 
#art-main, table
{
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    text-align: justify;
}
 
h1, h2, h3, h4, h5, h6, p, a, ul, ol, li
{
    margin: 0;
    padding: 0;
}
 
.art-postcontent,
.art-postcontent li,
.art-postcontent table,
.art-postcontent a,
.art-postcontent a:link,
.art-postcontent a:visited,
.art-postcontent a.visited,
.art-postcontent a:hover,
.art-postcontent a.hovered
{
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
}
 
.art-postcontent p
{
    margin: 12px 0;
}
 
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
{
  font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: 30px;
  text-decoration: none;
}
 
.art-postcontent a
{
  text-decoration: underline;
  color: #295C89;
}
 
.art-postcontent a:link
{
  text-decoration: underline;
  color: #295C89;
}
 
.art-postcontent a:visited, .art-postcontent a.visited
{
  text-decoration: none;
  color: #A79E44;
}
 
.art-postcontent  a:hover, .art-postcontent a.hover
{
  text-decoration: none;
  color: #F6AA7E;
}
 
.art-postcontent h1
{
   color: #7F7834;
margin: 0px 0;    
}
 
.art-blockcontent h1
{
margin: 0px 0; 
}
 
.art-postcontent h2
{
   color: #7F7834;
margin: 0px 0;
   font-size: 28px;    
}
 
.art-blockcontent h2
{
margin: 0px 0;
   font-size: 28px; 
}
 
.art-postcontent h2 a, .art-postcontent h2 a:link, .art-postcontent h2 a:hover, .art-postcontent h2 a:visited, .art-blockcontent h2 a, .art-blockcontent h2 a:link, .art-blockcontent h2 a:hover, .art-blockcontent h2 a:visited 
{
   font-size: 28px; 
}
 
.art-postcontent h3
{
   color: #A79E44;
margin: 0px 0;
   font-size: 18px;    
}
 
.art-blockcontent h3
{
margin: 18px 0;
   font-size: 18px; 
}
 
.art-postcontent h3 a, .art-postcontent h3 a:link, .art-postcontent h3 a:hover, .art-postcontent h3 a:visited, .art-blockcontent h3 a, .art-blockcontent h3 a:link, .art-blockcontent h3 a:hover, .art-blockcontent h3 a:visited 
{
   font-size: 18px; 
}
 
.art-postcontent h4
{
   color: #3A3718;
margin: 0px 0;
   font-size: 16px;    
}
 
.art-blockcontent h4
{
margin: 0px 0;
   font-size: 16px; 
}
 
.art-postcontent h4 a, .art-postcontent h4 a:link, .art-postcontent h4 a:hover, .art-postcontent h4 a:visited, .art-blockcontent h4 a, .art-blockcontent h4 a:link, .art-blockcontent h4 a:hover, .art-blockcontent h4 a:visited 
{
   font-size: 16px; 
}
 
.art-postcontent h5
{
   color: #3A3718;
margin: 0px 0;
   font-size: 14px;    
}
 
.art-blockcontent h5
{
margin: 23px 0;
   font-size: 14px; 
}
 
.art-postcontent h5 a, .art-postcontent h5 a:link, .art-postcontent h5 a:hover, .art-postcontent h5 a:visited, .art-blockcontent h5 a, .art-blockcontent h5 a:link, .art-blockcontent h5 a:hover, .art-blockcontent h5 a:visited 
{
   font-size: 14px; 
}
 
.art-postcontent h6
{
   color: #534F22;
margin: 0px 0;
   font-size: 12px;    
}
 
.art-blockcontent h6
{
margin: 28px 0;
   font-size: 12px; 
}
 
.art-postcontent h6 a, .art-postcontent h6 a:link, .art-postcontent h6 a:hover, .art-postcontent h6 a:visited, .art-blockcontent h6 a, .art-blockcontent h6 a:link, .art-blockcontent h6 a:hover, .art-blockcontent h6 a:visited 
{
   font-size: 12px; 
}
 
ul
{
  list-style-type: none;
}
 
ol
{
  list-style-position: inside;
}
 
html 
{
    height:100%;
}
 
#art-main
{
  display: inline-block;
  position: relative;
  z-index: 0;
  width: 100%;
  left: 0;
  top: 0;
  cursor:default;
  overflow:visible;
}
 
body
{
  padding: 0; 
  margin:0;
  color: #3A3718;
  height:100%;
  min-height:100%;
  background-color: #FDFEFF;
  background-image: url('../../webapplication/images/Bottom_texture.jpg');
  background-repeat: repeat-x;
  background-attachment: fixed;
  background-position: top left;
  min-width: 1000px;
}
 
.cleared
{
  display:block;
  clear: both;
  float: none;
  margin: 0;
  padding: 0;
  border: none;
  font-size: 0;
  height:0;
  overflow:hidden;
}
 
.reset-box
{
  overflow:hidden;
  display:table; 
}
 
form
{
  padding: 0 !important;
  margin: 0 !important;
}
 
table.position
{
  position: relative;
  width: 100%;
  table-layout: fixed;
}
/* end Page */
 
/* begin Header */
div.art-header
{
  margin: 0 auto;
  position: relative;
  z-index: -1;
  width:1000px;
  height: 130px;
  margin-top: 0;
  margin-bottom: -5px;
}
 
div.art-header-clip
{
  position: absolute;
  width:100%;
  left:0;
  overflow:hidden;
  height:130px;
}
 
.art-header-wrapper 
{
    position: relative;
    width:1000px;
    margin:0 auto;
}
.art-header-inner 
{
    margin: 0 8px;
}
 
div.art-header-center
{
    position: relative;
    width: 1000px;
    left:50%;
}
 
div.art-header-png
{
  position: absolute;
  left:-50%;
  top: 0;
  width: 1000px;
  height: 130px;
  background-image: url('../../webapplication/images/header.png');
  background-repeat: no-repeat;
  background-position:center center; 
}
 
div.art-header-jpeg
{
  position: absolute;
  top: 0;
  left:-50%;
  width: 1000px;
  height: 130px;
  background-image: url('../../webapplication/images/header.jpg');
  background-repeat: no-repeat;
  background-position: center center;
}
/* end Header */
 
/* begin HeaderObject */
div.art-headerobject
{
  display: block;
  left: 100%;
  margin-left: -210px;
  position: absolute;
  top: 0;
  width: 205px;
  height: 130px;
  background-image: url('../../webapplication/images/header-object.png');
}
/* end HeaderObject */
 
/* begin Logo */
div.art-logo
{
  display: block;
  position: absolute;
  top: 20px;
  left: 0;
  margin-left: 0;
}
 
h1.art-logo-name
{
  display: block;
  text-align: left;
  font-variant: small-caps;
  font-size: 35px;
  padding: 0;
  margin: 0;
  color: #000000 !important;
}
h1.art-logo-name a, 
h1.art-logo-name a:link, 
h1.art-logo-name a:visited, 
h1.art-logo-name a:hover
{
  font-variant: small-caps;
  font-size: 35px;
  padding: 0;
  margin: 0;
  color: #000000 !important;
}
 
h2.art-logo-text
{
  display: block;
  text-align: left;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-size: 19px;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
  color: #000000 !important;
}
h2.art-logo-text a,
h2.art-logo-text a:link,
h2.art-logo-text a:visited,
h2.art-logo-text a:hover
{
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-size: 19px;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
  color: #000000 !important;
}
 
#headline, #slogan 
{
    display: block;
    min-width: 150px;
    text-align: left;
}
/* end Logo */
 
/* begin Menu */
/* menu structure */
 
.art-hmenu a, .art-hmenu a:link, .art-hmenu a:visited, .art-hmenu a:hover
{
    outline: none;
}
 
.art-hmenu, .art-hmenu ul
{
  margin: 0;
  padding: 0;
  border: 0;
  list-style-type: none;
  display: block;
}
 
.art-hmenu li
{
  margin: 0;
  padding: 0;
  border: 0;
  display: block;
  float: left;
  position: relative;
  z-index: 5;
  background: none;
}
 
.art-hmenu li:hover
{
  z-index: 10000;
  white-space: normal;
}
 
.art-hmenu li li
{
  float: none;
}
 
.art-hmenu ul
{
  visibility: hidden;
  position: absolute;
  z-index: 10;
  left: 0;
  top: 0;
  background: none;
  min-height: 0;
  background-image: url('../../webapplication/images/spacer.gif');
  padding: 10px 30px 30px 30px;
  margin: -10px 0 0 -30px;
}
 
.art-hmenu li:hover>ul
{
  visibility: visible;
  top: 100%;
}
 
.art-hmenu li li:hover>ul
{
  top: 0;
  left: 100%;
}
 
.art-hmenu:after, .art-hmenu ul:after
{
  content: ".";
  height: 0;
  display: block;
  visibility: hidden;
  overflow: hidden;
  clear: both;
}
.art-hmenu{
  min-height: 0;
  position:relative;
  padding: 9px 13px 9px 13px;
}
 
.art-hmenu ul ul
{
  padding: 30px 30px 30px 10px;
  margin: -30px 0 0 -10px;
}
 
/* menu structure */
 
.art-nav
{
  position: relative;
  width:1000px;
  margin:0 auto;
  min-height: 47px;
  z-index: 100;
    margin-top: 5px;
    margin-bottom: -5px;
}
 
.art-nav-outer
{
    position:absolute;
    width:100%;
}
 
.art-nav-wrapper 
{
    position: relative;
    width:1000px;
    margin:0 auto;
        top: 8px;
        left: -5px;
}
.art-nav-inner 
{
    margin: 0 0px;
 
}
 
.art-nav-l, .art-nav-r
{
  position: absolute;
  z-index: -1;
  top: 0;
  height: 100%;
  background-image: url('../../webapplication/images/nav.png');
}
 
.art-nav-l
{
  left: 0;
  right: 23px;
}
 
.art-nav-r
{
  right: 0;
  width: 1000px;
  clip: rect(auto, auto, auto, 977px);
}
 
/* end Menu */
 
/* begin MenuItem */
.art-hmenu a
{
  position: relative;
  display: block;
  overflow: hidden;
  height: 29px;
  cursor: pointer;
  font-weight: bold;
  font-size: 11px;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
}
 
.art-hmenu ul li
{
    margin:0;
    clear: both;
}
 
.art-hmenu a .r, .art-hmenu a .l
{
  position: absolute;
  display: block;
  top: 0;
  z-index: -1;
  height: 97px;
  background-image: url('../../webapplication/images/menuitem.png');
}
 
.art-hmenu a .l
{
  left: 0;
  right: 4px;
}
 
.art-hmenu a .r
{
  width: 408px;
  right: 0;
  clip: rect(auto, auto, auto, 404px);
}
 
.art-hmenu a .t, .art-hmenu ul a, .art-hmenu a:link, .art-hmenu a:visited, .art-hmenu a:hover
{
  font-weight: bold;
  font-size: 11px;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
}
 
.art-hmenu a .t
{
  color: #16324B;
  padding: 0 14px;
  margin: 0 4px;
  line-height: 29px;
  text-align: center;
}
 
.art-hmenu a:hover .l, .art-hmenu a:hover .r
{
  top: -34px;
}
 
.art-hmenu li:hover>a .l, .art-hmenu li:hover>a .r
{
  top: -34px;
}
 
.art-hmenu li:hover a .l, .art-hmenu li:hover a .r
{
  top: -34px;
}
.art-hmenu a:hover .t
{
  color: #282610;
}
 
.art-hmenu li:hover a .t
{
  color: #282610;
}
 
.art-hmenu li:hover>a .t
{
  color: #282610;
}
 
/* end MenuItem */
 
/* begin MenuSeparator */
.art-hmenu .art-hmenu-li-separator
{
  display: block;
  width: 5px;
  height:29px;
}
.art-nav .art-hmenu-separator
{
  display: block;
  margin:0 auto;
  width: 1px;
  height: 29px;
  background-image: url('../../webapplication/images/menuseparator.png');
}
/* end MenuSeparator */
 
/* begin MenuSubItem */
.art-hmenu ul a
{
  display: block;
  white-space: nowrap;
  height: 26px;
  width: 180px;
  overflow: hidden;
  background-image: url('../../webapplication/images/subitem.png');
  background-position: left top;
  background-repeat: repeat-x;
  border-width: 1px;
  border-style: solid;
  border-color: #D0CA8B;
  text-align: left;
  text-indent: 12px;
  text-decoration: none;
  line-height: 26px;
  color: #16324B;
  margin:0;
  padding:0;
}
 
.art-nav ul.art-hmenu ul span, .art-nav ul.art-hmenu ul span span
{
  display: inline;
  float: none;
  margin: inherit;
  padding: inherit;
  background-image: none;
  text-align: inherit;
  text-decoration: inherit;
}
 
.art-hmenu ul a:link, .art-hmenu ul a:visited, .art-hmenu ul a:hover, .art-hmenu ul a:active, .art-nav ul.art-hmenu ul span, .art-nav ul.art-hmenu ul span span
{
  text-align: left;
  text-indent: 12px;
  text-decoration: none;
  line-height: 26px;
  color: #16324B;
  margin:0;
  padding:0;
}
 
.art-hmenu ul li a:hover
{
  color: #121107;
  border-color: #D0CA8B;
  background-position: 0 -26px;
}
 
.art-hmenu ul li:hover>a
{
  color: #121107;
  border-color: #D0CA8B;
  background-position: 0 -26px;
}
 
.art-nav .art-hmenu ul li a:hover span, .art-nav .art-hmenu ul li a:hover span span
{
  color: #121107;
}
 
.art-nav .art-hmenu ul li:hover>a span, .art-nav .art-hmenu ul li:hover>a span span
{
  color: #121107;
}
 
/* end MenuSubItem */
 
/* begin Box, Sheet */
.art-sheet
{
  position: relative;
  margin: 0 auto;
  min-width: 61px;
  min-height: 61px;
  margin-top: 5px;
  margin-bottom: -5px;
  cursor:auto;
  width: 1000px;
}
 
.art-sheet-body
{
  position: relative;
  padding: 8px;
    padding-top:8px;
    padding-bottom:8px;
}
 
.art-sheet-tr, .art-sheet-tl, .art-sheet-br, .art-sheet-bl, .art-sheet-tc, .art-sheet-bc,.art-sheet-cr, .art-sheet-cl
{
  position: absolute;
}
 
.art-sheet-tr, .art-sheet-tl, .art-sheet-br, .art-sheet-bl
{
  width: 80px;
  height: 80px;
  background-image: url('../../webapplication/images/sheet_s.png');
}
 
.art-sheet-tl
{
  top: 0;
  left: 0;
  clip: rect(auto, 40px, 40px, auto);
}
 
.art-sheet-tr
{
  top: 0;
  right: 0;
  clip: rect(auto, auto, 40px, 40px);
}
 
.art-sheet-bl
{
  bottom: 0;
  left: 0;
  clip: rect(40px, 40px, auto, auto);
}
 
.art-sheet-br
{
  bottom: 0;
  right: 0;
  clip: rect(40px, auto, auto, 40px);
}
 
.art-sheet-tc, .art-sheet-bc
{
  left: 40px;
  right: 40px;
  height: 80px;
  background-image: url('../../webapplication/images/sheet_h.png');
}
 
.art-sheet-tc
{
  top: 0;
  clip: rect(auto, auto, 40px, auto);
}
 
.art-sheet-bc
{
  bottom: 0;
  clip: rect(40px, auto, auto, auto);
}
 
.art-sheet-cr, .art-sheet-cl
{
  top: 40px;
  bottom: 40px;
  width: 80px;
  background-image: url('../../webapplication/images/sheet_v.png');
}
 
.art-sheet-cr
{
  right: 0;
  clip: rect(auto, auto, auto, 40px);
}
 
.art-sheet-cl
{
  left: 0;
  clip: rect(auto, 40px, auto, auto);
}
 
.art-sheet-cc
{
  position: absolute;
  top: 40px;
  left: 40px;
  right: 40px;
  bottom: 40px;
  background-color: #FFFFFF;
}
 
#art-page-background-top-texture, #art-page-background-middle-texture, #art-page-background-glare
{
  min-width: 1000px;
}
 
/* end Box, Sheet */
 
/* begin Layout */
.art-content-layout
{
  display: table;
  position:relative;
  margin: 0 auto;
  table-layout: fixed;
  border-collapse: collapse;
  background-color: Transparent;
  border: none !important;
  padding:0 !important;
  width:100%;
  margin-top:0;
  margin-bottom:0;
}
.art-layout-cell, .art-content-layout-row
{
  background-color: Transparent;
  vertical-align: top;
  text-align: left;
  border: none;
  margin:0;
  padding:0;
}
 
.art-content-layout .art-content-layout{width: auto;margin:0;}
.art-content-layout .art-layout-cell, .art-content-layout .art-layout-cell .art-content-layout .art-layout-cell{display: table-cell;}
.art-layout-cell .art-layout-cell{display: block;}
.art-content-layout-row {display: table-row;}
.art-layout-glare{position:relative;}/* end Layout */
 
/* begin Box, Block */
.art-block
{
  position: relative;
  top: 10px;
  margin: 0;
}
 
.art-block-body
{
  position: relative;
  padding: 0;
}
 
div.art-block img
{
/* WARNING do NOT collapse this to 'border' - inheritance! */
    border-color: #C4BD6E;
  border-style: solid;
  margin: 10px;
}
 
/* end Box, Block */
 
/* begin BlockHeader */
.art-blockheader
{
  margin-bottom: 0;
  position: relative;
  height: 25px;
}
 
.art-blockheader h3.t
{
  position: relative;
  height: 25px;
  color: #102537;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-variant: small-caps;
  font-size: 13px;
  margin:0;
  padding: 0px 0px 0 40px;
  white-space: nowrap;
  line-height: 25px;
}
 
.art-blockheader h3.t a,
.art-blockheader h3.t a:link,
.art-blockheader h3.t a:visited, 
.art-blockheader h3.t a:hover
{
  color: #102537;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-variant: small-caps;
  font-size: 13px;
}
 
.art-blockheader .l, .art-blockheader .r
{
  position: absolute;
  height: 25px;
  background-image: url('../../webapplication/images/blockheader.png');
}
 
.art-blockheader .l
{
  left: 0;
  right: 25px;
}
 
.art-blockheader .r
{
  width: 984px;
  right: 0;
  clip: rect(auto, auto, auto, 959px);
}
 
/* end BlockHeader */
 
/* begin Box, BlockContent */
.art-blockcontent
{
  position: relative;
  margin: 0 auto;
  min-width: 23px;
  min-height: 23px;
}
 
.art-blockcontent-body
{
  position: relative;
  padding: 9px;
  color: #3A3718;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}
 
.art-blockcontent-tr, .art-blockcontent-tl, .art-blockcontent-br, .art-blockcontent-bl, .art-blockcontent-tc, .art-blockcontent-bc,.art-blockcontent-cr, .art-blockcontent-cl
{
  position: absolute;
}
 
.art-blockcontent-tr, .art-blockcontent-tl, .art-blockcontent-br, .art-blockcontent-bl
{
  width: 22px;
  height: 22px;
  background-image: url('../../webapplication/images/blockcontent_s.png');
}
 
.art-blockcontent-tl
{
  top: 0;
  left: 0;
  clip: rect(auto, 11px, 11px, auto);
}
 
.art-blockcontent-tr
{
  top: 0;
  right: 0;
  clip: rect(auto, auto, 11px, 11px);
}
 
.art-blockcontent-bl
{
  bottom: 0;
  left: 0;
  clip: rect(11px, 11px, auto, auto);
}
 
.art-blockcontent-br
{
  bottom: 0;
  right: 0;
  clip: rect(11px, auto, auto, 11px);
}
 
.art-blockcontent-tc, .art-blockcontent-bc
{
  left: 11px;
  right: 11px;
  height: 22px;
  background-image: url('../../webapplication/images/blockcontent_h.png');
}
 
.art-blockcontent-tc
{
  top: 0;
  clip: rect(auto, auto, 11px, auto);
}
 
.art-blockcontent-bc
{
  bottom: 0;
  clip: rect(11px, auto, auto, auto);
}
 
.art-blockcontent-cr, .art-blockcontent-cl
{
  top: 11px;
  bottom: 11px;
  width: 22px;
  background-image: url('../../webapplication/images/blockcontent_v.png');
}
 
.art-blockcontent-cr
{
  right: 0;
  clip: rect(auto, auto, auto, 11px);
}
 
.art-blockcontent-cl
{
  left: 0;
  clip: rect(auto, 11px, auto, auto);
}
 
.art-blockcontent-cc
{
  position: absolute;
  top: 11px;
  left: 11px;
  right: 11px;
  bottom: 11px;
  background-image: url('../../webapplication/images/blockcontent_c.png');
}
 
.art-blockcontent-body table,
.art-blockcontent-body li, 
.art-blockcontent-body a,
.art-blockcontent-body a:link,
.art-blockcontent-body a:visited,
.art-blockcontent-body a:hover
{
  color: #3A3718;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}
 
.art-blockcontent-body p
{
  margin: 6px 0;
}
 
.art-blockcontent-body a, .art-blockcontent-body a:link
{
  color: #367AB5;
  text-decoration: none;
}
 
.art-blockcontent-body a:visited, .art-blockcontent-body a.visited
{
  color: #C1B967;
  text-decoration: none;
}
 
.art-blockcontent-body a:hover, .art-blockcontent-body a.hover
{
  color: #5A98CE;
  text-decoration: underline;
}
 
.art-blockcontent-body ul li
{
  line-height: 125%;    
  color: #1D1C0C;
  padding: 0 0 0 13px;
  background-image: url('../../webapplication/images/blockcontentbullets.png');
  background-repeat: no-repeat;
}/* end Box, BlockContent */
 
/* begin Button */
.art-button-wrapper a.art-button,
.art-button-wrapper a.art-button:link,
.art-button-wrapper input.art-button,
.art-button-wrapper button.art-button
{
  text-decoration: none;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: 11px;
  position:relative;
  top:0;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  color: #282610 !important;
  width: auto;
  outline: none;
  border: none;
  background: none;
  line-height: 29px;
  height: 29px;
  margin: 0 !important;
  padding: 0 14px !important;
  overflow: visible;
  cursor: pointer;
}
 
.art-button img, .art-button-wrapper img
{
  margin: 0;
  vertical-align: middle;
}
 
.art-button-wrapper
{
  vertical-align: middle;
  display: inline-block;
  position: relative;
  height: 29px;
  overflow: hidden;
  white-space: nowrap;
  width: auto;
  margin: 0;
  padding: 0;
  z-index: 0;
}
 
.firefox2 .art-button-wrapper
{
  display: block;
  float: left;
}
 
input, select, textarea
{
  vertical-align: middle;
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  font-size: 11px;
}
 
.art-block select 
{
    width:96%;
}
 
.art-button-wrapper.hover .art-button, .art-button-wrapper.hover a.art-button:link, .art-button:hover
{
  color: #FBD9C6 !important;
  text-decoration: none !important;
}
 
.art-button-wrapper.active .art-button, .art-button-wrapper.active a.art-button:link
{
  color: #E9E6C9 !important;
}
 
.art-button-wrapper .art-button-l, .art-button-wrapper .art-button-r
{
  display: block;
  position: absolute;
  height: 97px;
  margin: 0;
  padding: 0;
  background-image: url('../../webapplication/images/button.png');
}
 
.art-button-wrapper .art-button-l
{
  left: 0;
  right: 5px;
}
 
.art-button-wrapper .art-button-r
{
  width: 403px;
  right: 0;
  clip: rect(auto, auto, auto, 398px);
}
 
.art-button-wrapper.hover .art-button-l, .art-button-wrapper.hover .art-button-r
{
  top: -34px;
}
 
.art-button-wrapper.active .art-button-l, .art-button-wrapper.active .art-button-r
{
  top: -68px;
}
 
.art-button-wrapper input
{
  float: none !important;
}
/* end Button */
 
/* begin Box, Post */
.art-post
{
  position: relative;
  margin: 5px;
}
 
.art-post-body
{
  position: relative;
  padding: 0px;
}
 
a img
{
  border: 0;
}
 
.art-article img, img.art-article, .art-block img, .art-footer img
{
  border: solid 1px #C4BD6E;
  margin: 5px;
}
 
.art-metadata-icons img
{
  border: none;
  vertical-align: middle;
  margin: 2px;
}
 
.art-article table, table.art-article
{
  border-collapse: collapse;
  margin: 1px;
}
 
.art-article th, .art-article td
{
  padding: 2px;
  border: solid 1px #C4BD6E;
  vertical-align: top;
  text-align: left;
}
 
.art-article th
{
  text-align: center;
  vertical-align: middle;
  padding: 7px;
}
 
pre
{
  overflow: auto;
  padding: 0.1em;
}
 
/* end Box, Post */
 
/* begin PostHeaderIcon */
h2.art-postheader
{
  color: #5B5625;
  margin: 6px 0;
  font-size: 28px;
  text-align: center;
}
 
h2.art-postheader a, 
h2.art-postheader a:link, 
h2.art-postheader a:visited,
h2.art-postheader a.visited,
h2.art-postheader a:hover,
h2.art-postheader a.hovered
{
  font-size: 28px;
  text-align: center;
}
 
h2.art-postheader a, h2.art-postheader a:link
{
  text-align: left;
  text-decoration: none;
  color: #6EA4D4;
}
 
h2.art-postheader a:visited, h2.art-postheader a.visited
{
  color: #B5AC4A;
}
 
h2.art-postheader a:hover,  h2.art-postheader a.hovered
{
  color: #5A98CE;
}
 
/* end PostHeaderIcon */
 
/* begin PostIcons, PostHeaderIcons */
.art-postheadericons,
.art-postheadericons a,
.art-postheadericons a:link,
.art-postheadericons a:visited,
.art-postheadericons a:hover
{
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  text-align: center;
  color: #777231;
}
 
.art-postheadericons
{
  padding: 1px;
}
 
.art-postheadericons a, .art-postheadericons a:link
{
  font-style: italic;
  text-decoration: none;
  color: #282610;
}
 
.art-postheadericons a:visited, .art-postheadericons a.visited
{
  color: #7F7834;
}
 
.art-postheadericons a:hover, .art-postheadericons a.hover
{
  text-decoration: underline;
  color: #5A98CE;
}
/* end PostIcons, PostHeaderIcons */
 
/* begin PostContent */
.art-postcontent
{
  display:inline;
}
/* end PostContent */
 
/* begin PostBullets */
.art-post ol, .art-post ul
{
  margin: 1em 0 1em 2em;
  padding: 0;
}
 
.art-post li
{
  font-size: 12px;
  color: #5B5625;
  padding: 0 0 0 14px;
}
 
.art-post li ol, .art-post li ul
{
  margin: 0.5em 0 0.5em 2em;
  padding: 0;
}
 
.art-post ol>li
{
  background: none;
  padding-left: 0;
  /* overrides overflow for "ul li" and sets the default value */
  overflow: visible;
}
 
.art-post ul>li
{
  background-image: url('../../webapplication/images/postbullets.png');
  background-repeat: no-repeat;
  padding-left: 14px;
  /* makes "ul li" not to align behind the image if they are in the same line */
  overflow-x: visible;
  overflow-y: hidden;
}
 
/* end PostBullets */
 
/* begin PostQuote */
.art-postcontent blockquote,
.art-postcontent blockquote a,
.art-postcontent blockquote a:link,
.art-postcontent blockquote a:visited,
.art-postcontent blockquote a:hover
{
  color: #180A02;
}
 
.art-postcontent blockquote p
{
   margin: 0px 0 0px 0px;
}
 
.art-postcontent blockquote
{
   border: solid 1px #D0CA8B;
  margin: 0px 0px 0px 0px;
  padding: 0 0 0 0px;
  background-color: #DCD7A8;
  background-image: url('../../webapplication/images/postquote.png');
  background-position: left top;
  background-repeat: no-repeat;
  /* makes blockquote not to align behind the image if they are in the same line */
  overflow: auto;
  clear:both;
}
 
/* end PostQuote */
 
/* begin PostMetadata, PostMetadataFooter */
.art-postmetadatafooter
{
  overflow:hidden;
  padding: 1px;
  background-image: url('../../webapplication/images/postmetadatafooter_bg.png');
  border-color: #D0CA8B;
  border-style: solid;
  border-width: 0;
}
/* end PostMetadata, PostMetadataFooter */
 
/* begin PostIcons, PostFooterIcons */
.art-postfootericons,
.art-postfootericons a,
.art-postfootericons a:link,
.art-postfootericons a:visited,
.art-postfootericons a:hover
{
  font-family: Tahoma, Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  text-align: center;
  color: #777231;
}
 
.art-postfootericons
{
  padding: 1px;
}
 
.art-postfootericons a, .art-postfootericons a:link
{
  font-style: italic;
  text-decoration: none;
  color: #24220F;
}
 
.art-postfootericons a:visited, .art-postfootericons a.visited
{
  color: #6D672C;
}
 
.art-postfootericons a:hover, .art-postfootericons a.hover
{
  text-decoration: underline;
  color: #3B84C4;
}
/* end PostIcons, PostFooterIcons */
 
/* begin Footer */
.art-footer
{
  position: relative;
  margin-top:0;
  margin-bottom:0;
  width: 100%;
}
 
.art-footer-b 
{
  position: absolute;
  left:17px;
  right:17px;
  bottom:0;
  height:50px;
  background-image: url('../../webapplication/images/footer_b.png');
}
 
.art-footer-r, .art-footer-l
{
  position: absolute;
  height:50px;
  background-image: url('../../webapplication/images/footer_s.png');
  bottom: 0;
}
 
.art-footer-l
{
  left: 0;
  width:17px;
}
 
.art-footer-r
{
  right: 0;
  width:34px;
  clip: rect(auto, auto, auto, 17px);
}
 
.art-footer-t
{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 50px;
  background-color: #A5C6E4;
}
 
.art-footer-body
{
    position:relative;
    padding: 10px;
}
 
.art-footer-text p
{
  padding:0;
  margin:0;
  text-align: center;
}
 
.art-footer-text,
.art-footer-text a,
.art-footer-text a:link,
.art-footer-text a:visited,
.art-footer-text a:hover,
.art-footer-text td, 
.art-footer-text th,
.art-footer-text caption
{
    color: #000000;
    font-size: 11px;
}
 
.art-footer-text
{
  min-height: 5px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
}
 
.art-footer-text a,
.art-footer-text a:link
{
  color: #234F76;
  text-decoration: none;
}
 
.art-footer-text a:visited
{
  color: #918A3B;
}
 
.art-footer-text a:hover
{
  color: #EE6211;
  text-decoration: underline;
}
 
div.art-footer img
{
/* WARNING do NOT collapse this to 'border' - inheritance! */
    border-color: #C4BD6E;
  border-style: solid;
  margin: 7px;
}/* end Footer */
 
/* begin PageFooter */
.art-page-footer, 
.art-page-footer a,
.art-page-footer a:link,
.art-page-footer a:visited,
.art-page-footer a:hover
{
  font-family: Arial;
  font-size: 10px;
  letter-spacing: normal;
  word-spacing: normal;
  font-style: normal;
  font-weight: normal;
  text-decoration: underline;
  color: #468BC8;
}
 
.art-page-footer
{
  padding: 1em;
  text-align: center;
  text-decoration: none;
  color: #3B84C4;
}
/* end PageFooter */
 
/* begin LayoutCell, sidebar1 */
 
.art-content-layout .art-sidebar1
{
  width: 200px;
}
 
/* end LayoutCell, sidebar1 */
 
/* begin LayoutCell, content */
 
/* end LayoutCell, content */
 
.campaign
{
  position: absolute;
 bottom: -14px;
  left: 460px;
}
 
.logininfo
{
    position:absolute;
    right:200px;
}
 
.dashboard-cell
{
   width:50%;
}
.dashboard-table
{
   width:100%;
}
 
.test
{
    position:relative;
    bottom: 200px;
    left: 50px;
      
}

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

css formating when ajaxmanager set to control

1 Answer, 1 is accepted