3

I have an asp:TabContainer on a form and after the app is re-deployed to the server, the tabs aren't styled. If I take the Webresource.axd URL and try to load it in the browser, I get a redirect to a login page, so it seems like an authentication problem, yet the rest of the app has already been logged in long before you get to the page with the tab control.

A restart of the web server and even a reboot don't appear to affect it.

Then, eventually the styles start working and do not stop working until another deployment, when it usually exhibits the same behavior.

Is there some kind of caching or permissions issue going on?

Unstyled tabs

Styled tabs

Here's the authentication from the web.config:

<authentication mode="Forms">
    <forms name=".ASPXAUTH" protection="All" timeout="2400" loginUrl="Default.htm"/>
</authentication>
Cade Roux
  • 88,164
  • 40
  • 182
  • 265
  • Have you done form authentication? then tell me authentication configuration of web.config i can help in this issue.. – Arun Rana Oct 15 '11 at 04:12
  • Could be a browser cache problem, very unlikely though. Not much to go on but you might need to add a exception into the web.config for the WebRescource.axd to make it always available??? – edhurtig Oct 16 '11 at 22:13
  • @ArunRana I copied the Forms Authentication section from the web.config into the question. – Cade Roux Oct 17 '11 at 20:08

2 Answers2

2

The Problem is protection level(ALL). Make it CSS files are available to non protected pages.

<location path="cssname.css">
    <system.web>
      <authorization>
         <allow users="*"/>
       </authorization>
     </system.web>
</location>

Learn More about Setting authorization rules for a particular page or folder in web.config

Anand Thangappan
  • 3,068
  • 2
  • 28
  • 31
0

if u have changes the cssclass of the tab container, it will look like this.. if u want to completely change the look of tabcontainer u have to include the entire css of the tab container

.tab
{
    margin:5px 0px 5px 0px;    
}

.tab .ajax__tab_header
{
    font-family: arial,helvetica,clean,sans-serif;
    font-size: small;
    border-bottom: solid 5px #00B3B2;
    padding-left: 50px;
}
.tab .ajax__tab_header .ajax__tab_outer
{
    background: url(../Images/sprite.png) #d8d8d8 repeat-x;
    margin: 0px 0.16em 0px 0px;
    padding: 1px 0px 1px 0px;
    vertical-align: bottom;
    border: solid 1px #a3a3a3;
    border-bottom-width: 0px;
    border-radius: 5px 5px 0px 0px;
}
.tab .ajax__tab_header .ajax__tab_tab
{
    color: #000;
    padding: 0.35em 0.75em;
    margin-right: 0.01em;
}
.tab .ajax__tab_hover .ajax__tab_outer
{
    background: url(../Images/sprite.png) #bfdaff repeat-x left -1300px;
    cursor: pointer;
}
.tab .ajax__tab_active .ajax__tab_tab
{
    color: #fff;
}
.tab .ajax__tab_active .ajax__tab_outer
{
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADICAYAAAAp8ov1AAAAAXNSR0IArs4c6QAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9oJGA41KpTYroIAAACASURBVCjP7ZE7DsJADESfJiL37znNXoJLUNARa7Ni6Bw5AtFEqXAx8vj/wfZNwBBAakPAWukQEJUu1RGVLt9su4yo9eJ3t0FrDWyTg58HezlujFPE9lXAQ8BdQM93R9LtM2ve/vnB22tcF/DaTpItJwHKVWcBk4BLwlw1/nAUvAGm30u0udPq+QAAAABJRU5ErkJggg==") #00B3B2 repeat-x left -100px;
}
.tab .ajax__tab_body
{
    font-family: verdana,tahoma,helvetica;
    font-size: 10pt;
    padding: 0.25em 0.5em;
    border: solid 1px #00B3B2;
    border-bottom:0px;
    border-right:0px;
    border-top-width: 0px;
}

now just include the cssclass for the tab container

Kishore Kumar
  • 12,675
  • 27
  • 97
  • 154
  • I don't think this is the problem. It stops working after a deployment, then eventually works fine all by itself, so it has to be something dynamic. – Cade Roux Oct 17 '11 at 20:20