[DevExpress Support Team: CLONED FROM T319200: ASPxPopupControl - A modal popup is hidden behind another one when a nested drop-down editor is selected]
Hello Alessandro,
I downloaded the hot fix DevExpressComponents-15.2.4.16013.exe installed it. I am running DevExpress 15.2.4.
After the hot fix installation I noticed that all my tables had collapsed border by default. I went into source code to figure out the problem and found out that hot fix modified DevExpress.Web\Css\System.css. The code that was added is:
/* td paddings and spacing styles */
table
{
border-width: 0;
border-collapse: collapse;
border-spacing: 0;
}
td,
th
{
padding: 0;
}
The effect of this is that it affects all tables across the board which affects the original design drastically. This is not acceptable it must be fixed ASAP!
Thank you
Dmitri.
We have closed this ticket because another page addresses its subject:
HotFixes for version 15.2.4 break HTML Table rendering if doctypeMode="Xhtml"CSS rules from the System.css file change the external layout
Answers approved by DevExpress Support
Hello,
Thank you for your patience. Having researched this issue, we have concluded that it is caused by the following reason:
By default, different tags (such as the table, td, and th that are widely used in DevExpress ASP.NET controls' rendering) may have different appearance in different browsers (according to their default user agent stylesheets). Usually, the so-called "reset css" or "normalize css" technique is used to make styling of all/certain HTML elements/tags consistent in different browsers.
A similar technique is used when placing any visual DevExpress ASP.NET control to the form. However, the related CSS only resets/normalizes the default table, td, and th tags appearance, but does not specify some pre-defined/custom appearance. Applying custom CSS classes to all tags (table, td, th) to be reset/normalized may significantly increase the volume of the resultant HTML rendering (because numerous HTML tags for different visual elements may be rendered).
If you need to specify some non-default (i.e., non-normalized, but custom one) appearance for certain tags, simply place the corresponding CSS ("inline" or separate files) to the "head" tag.
Please note that this technique may cause unexpected visual effects. See the KA18769: CSS - Conflicts when applying global CSS selectors for common HTML tags (table, etc.) KB Article for more information.
Let us know if you need further assistance with customizing styles in your real affected project. We will be happy to help you.
Hi MIke,
Your response is not appropriate, in my opinion. DevExpress just changed the way an HTML tag is rendering across the board, whether or not the tag is part of DevExpress control or not. This is absolutely unacceptable. Plus, you can imagine that other non-DevExpress components or controls may be used in the same project, can't you? With this late fix of yours, you changed their behavior as well. You cannot assume the role of an all-knowing entity (God?) and dictate how certain HTML tags are to be rendered for the whole site. Please undo this as soon as possible, as this is completely unacceptable.
Thank you
Eugene
In addition to what I said earlier, I would like to add that I looked at KA 18769 article that you referred to. It actually outlines the appropriate behavior that DevExpress claims to be following, just not in this particular case. For example, these statements are from the article you referred to:
-------------------------
Currently, we offer the following solutions for the mentioned scenarios:
- Standard Visual Studio project templates:
Take special note why it is recommended to use DevExpress project templates when creating a new application from scratch.
- Our project templates do not include global styles that might implicitly affect other 3-rd party controls/elements derived from regular HTML elements.
…
- Custom (legacy) stylesheets with global CSS selectors:
When defining your own stylesheets (or you have existing legacy stylesheets), it is recommended to use the CSS classes (rather than the global) with unique names. This approach allows you to apply styling for the specified HTML elements only and does not affect 3rd party control elements.
-------------------------
As you can see, the rules above about making CSS classes and not affecting regular HTML elements are the rules we should all follow, including DevExpress.
Hello,
Thank you for your valuable feedback and patience. We have resolved this issue in the context of the T337390: HotFixes for version 15.2.4 break HTML Table rendering if doctypeMode="Xhtml" report. You are welcome to download and install the hotfix from that report, upgrade your application and check if the issue goes away. We look forward to your feedback once you have had the opportunity to install and check the new build.
Hello Dmitry,
This file contains CSS rules for internal use and these rules can be modified without any notification. Would you please provide me with the markup and code snippets that you are using? So, I will be able to reproduce the problem on my side. Screenshots demonstrating an unexpected behavior will be also helpful. This information will allow me to suggest an appropriate solution to you.
Jenny,
Just put any table on any page, by default border is collapsed. Look at the code in the browser (F12) and see why this happens. The style comes from css file mentioned above and affects all <table> tags across the board. I understand it is for internal use, but rules for internal use are wrong if they affect all table tags across the board and must be fixed. Proper convention is to make a separate css class for tables that you want to affect, BUT not to hang it on table class which will affect all tables across the board.
Thank you.
Dmitri
Hello Dmitry,
I have reproduced this behavior and forwarded this issue to our developers. We will update this thread as soon as any news is available.
Hi Jenny,
Thank you for taking case of the issue. Please let developers know that the same applies for styles
td,
th
{
padding: 0;
}
this will affect padding of all td and th tags. Same rules should apply - they must create separate classes and use them on the elements they want to change, not across all of them as they did here.
Thank you
Dmitri.
PS: Jenny, this is an urgent matter. It is not just one control that was affected but the entire site design for us. I understand that your team is working on the solution, however please keep in mind the urgency of the matter.
We need the hot fix because it is fixing improper behavior of the other controls, but we cannot accept the default styles on the tags described in the original post.
Jenny
I'd just like to add that this issue is causing us a major problem as well.
Regards
Don
While I have DevEx 15.2.5 installed on one of my sites and I didn't see a problem, I just updated to 15.2.5 on my second site and I'm having the same problem described above. You created CSS for a Major component the is site wide. I'm just now digging into it and while I seem to have most of the site working fine now, I'm still finding a couple of spots where my form just doesn't look right because you put in CSS for Table and TD. I can't imagine why that should have been acceptable. There was a lot of explanation that you gave but I don't understand a lot of it on first glance and again, you gave CSS for a Table for gosh sakes. Tables are used everywhere even though we should be weening off of them. Just my 2 cents.