Styling problem with the latest release

[Andy Green]

Hi All

I have a problem where the Rad page no sits below the LH menu, and I have a gap between the tab bar and the start of the RadPage. This has only happend since upgrading to the 2010.1.411.35 build.

If you look at Capture2.png this style seems to be new and its the content: ""; that is causing the problem. If I disable the style using IE Dev toolbar the Rad page sits properly under the tab bar.

Andy Ideas

[Andy Green]

Anyone??

This is also the case in IE 9, FF & Chrome.

Andy

[Kate]

Hello Andy,

Since the screenshot that you attached in not sufficient for me to replicate the appearance that you get. I would like to ask you to provide either a live url or a simplified runnable project that I can test locally. Thus I would be able to determine what is causing the issue that you describe.

Regards,
Kate
the Telerik team

[Andy Green]

Thanks Kate

You can see the problem here - http://www.into-activity.co.uk/Admin/SystemSettings.aspx

Username - telerik
Password- telerik

Andy

[Kate]

Hi Andy,

You can use the following css class selector to get the desired appearance:

div.RadTabStrip:after,
div.RadTabStripVertical:after,
div.RadTabStrip .rtsLevel:after,
div.RadTabStripVertical .rtsLevel:after,
div.RadTabStrip .rtsScroll:after,
div.RadTabStripVertical .rtsScroll:after,
div.RadTabStrip .rtsUL:after,
div.RadTabStripVertical .rtsUL:after,
div.RadTabStrip .rtsLI:after,
div.RadTabStripVertical .rtsLI:after {
    clear: none;
}

All the best,
Kate
the Telerik team

[Pascal]

Hello Kate,

We encounter exactly the same issue. We try your workaround and it doesn't work for us. However, we found this solution : 

.RadTabStrip .rtsLevel
{
    clear: none !important;
}

div.RadTabStrip:after,
div.RadTabStripVertical:after,
div.RadTabStrip .rtsLevel:after,
div.RadTabStripVertical .rtsLevel:after,
div.RadTabStrip .rtsScroll:after,
div.RadTabStripVertical .rtsScroll:after,
div.RadTabStrip .rtsUL:after,
div.RadTabStripVertical .rtsUL:after,
div.RadTabStrip .rtsLI:after,
div.RadTabStripVertical .rtsLI:after {
    content : normal;
}

What do you think? Is it an issue with the latest telerik build?

Thanks
Pascal

[Andy Green]

Hi Kate

Thanks, this worked for me, as did the solution from Pascal. Is this a control issue, I ask because if it gets fixed, I'd like to be able to remove the CSS fix.

Andy

[Kate]

Hello Andy,

This is the first time we get this appearance and in general when using the RadTabStrip control in a combination with RadMultiPage (with any of the later version of our controls) I am not able to replicate the issue that you get on your web site. I am no longer able to access your site to fully inspect it again but my assumption is that it might be caused by some custom css styles that you apply to your page. 

All the best,
Kate
the Telerik team

[Andy Green]

Sorry Kate , I assumed you had finished with access. I have re enabled the account.

Andy

[Kate]

Andy,

Thanks for the access. After inspecting your site further here are my findings. Currently the sidebar
div element occupies the white space between the RadTabStrip and the RadMultiPage control. Simply positioning the two divs with id-s main and sidebar with float left ( one next to each other) enables you get the correct appearance. You can also adjust the margin in between them:

#main {
    float: left;
    margin: 0 0 0 2px;
}

 

Greetings,
Kate
the Telerik team

[Andy Green]

Thanks again Kate.

Above an beyond the call of duty.

Andy