| Summary: | [Theme] border-radius does not clip the content in IE8 | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Product: | [RT] RAP | Reporter: | Andreas Hoegger <Andreas.Hoegger> | ||||||||
| Component: | RWT | Assignee: | Project Inbox <rap-inbox> | ||||||||
| Status: | RESOLVED WONTFIX | QA Contact: | |||||||||
| Severity: | normal | ||||||||||
| Priority: | P3 | CC: | tbuschto | ||||||||
| Version: | 1.5 | ||||||||||
| Target Milestone: | --- | ||||||||||
| Hardware: | PC | ||||||||||
| OS: | Windows XP | ||||||||||
| Whiteboard: | |||||||||||
| Attachments: |
|
||||||||||
Created attachment 201192 [details]
IE8 with overloaded borders
Created attachment 201193 [details]
Mozilla correct border
Created attachment 201194 [details]
sample project to reproduce with product to start
Firefox 4+ and current WebKit browsers use CSS3 for border-radius, which allows content to be clipped by the the rounded border. Because of some limitations of CSS3 support in IE9 it still uses VML for rounded border creation. As a result it's not possible to clip the content in IE. This is a known limitation of rounded border implementation in all browsers that does not fully support CSS3 (still use VML or SVG). I tend to close it as WONTFIX. Tim, am I right? This problem will go away when all browsers support rounded borders. In the meantime, application programmers have to work around this by adding a suitable padding. If you want the label to appear at the very top of the composite, you can also add a padding only to the left and right edge: padding: 0 8px; Alternatively, you can also add a margin to the layout: FillLayout layout = new FillLayout(); layout.marginWidth = 8; rootPane.setLayout(layout); Since a) we cannot fix it, b) it will be resolved once we can drop support for the old browsers and c) there are workarounds, I would also close this bug as WONTFIX. (In reply to comment #5 and comment #6) > Since a) we cannot fix it, b) it will be resolved once we can drop support for > the old browsers and c) there are workarounds, I would also close this bug as > WONTFIX. |
Having a composite with a border radius and no padding containing any control with non transparent background the border of the composite gets overloaded with the controls background. Code: Composite rootPane = new Composite(parent, SWT.NONE); /* * Composite.container { * background-color: #ffffff; * border: 1px solid #bbcddb; * border-radius: 8px 8px 0px 0px; * } */ rootPane.setData(WidgetUtil.CUSTOM_VARIANT, "container"); Label l = new Label(rootPane, SWT.CENTER); l.setText("A text"); rootPane.setLayout(new FillLayout()); To add also a border radius or a transparent background is no option since the same controls are reused in several contexts (dynamic controls of Scout).