Bug 60450

Summary:

border-color: transparent or rgba(0,0,0,0) doesn't make <select> border disappear

Product:

WebKit

Reporter:

PlasticLawnDaemon <M8R-8udtis>

Component:

Forms

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED INVALID

Severity:

Trivial

CC:

mihnea

Priority:

Version:

528+ (Nightly build)

Hardware:

All

OS:

Windows XP

URL:

data:text/html;charset=utf-8,<html>%0D%0A<style>%0D%0A %23SEL {%0D%0A border%3A 1px solid%3B border-color%3A transparent%3B%0D%0A }%0D%0A%0D%0A %23SEL1 {%0D%0A border%3A 1px solid%3B border-color%3A rgba(0%2C0%2C0%2C0)%3B%0D%0A }%0D%0A%0D%0A %23SEL2 {%0D%0A border%3A 1px solid%3B border-color%3A black%3B%0D%0A }%0D%0A <%2Fstyle>%0D%0A <body>%0D%0A <select id%3D"SEL">%0D%0A <option>A<%2Foption>%0D%0A <option>B<%2Foption>%0D%0A <option>C<%2Foption>%0D%0A <%2Fselect>%0D%0A%0D%0A <select id%3D"SEL1">%0D%0A <option>A<%2Foption>%0D%0A <option>B<%2Foption>%0D%0A <option>C<%2Foption>%0D%0A <%2Fselect>%0D%0A%0D%0A <select id%3D"SEL2">%0D%0A <option>A<%2Foption>%0D%0A <option>B<%2Foption>%0D%0A <option>C<%2Foption>%0D%0A <%2Fselect>%0D%0A%0D%0A <%2Fbody> %0D%0A<%2Fhtml>

Attachments:

Description	Flags
Select element border visibility testcase	none
Switching to use rgba(0,0,0,0) instead of 'transparent' doesn't work around this	none
Screenshot of code from comment #2	none
Workaround using border:0	none

PlasticLawnDaemon

Reported 2011-05-08 02:28:43 PDT

Created attachment 92734 [details] Select element border visibility testcase View the attached example that should only have the dropdown button visible on select elements. Having background-color: transparent works, but border-color: transparent doesn't. Sorry if "forms" is the wrong component here, I was tossing up between that and "CSS"

Attachments
Select element border visibility testcase (32.34 KB, text/html) 2011-05-08 02:28 PDT, PlasticLawnDaemon	no flags	Details
Switching to use rgba(0,0,0,0) instead of 'transparent' doesn't work around this (32.34 KB, text/html) 2011-05-08 03:49 PDT, PlasticLawnDaemon	no flags	Details
Screenshot of code from comment #2 (13.32 KB, image/png) 2011-05-09 14:57 PDT, PlasticLawnDaemon	no flags	Details
Workaround using border:0 (32.35 KB, text/html) 2011-05-10 01:17 PDT, PlasticLawnDaemon	no flags	Details
Show Obsolete (2) View All Add attachment proposed patch, testcase, etc.

PlasticLawnDaemon

Comment 1 2011-05-08 03:49:43 PDT

Created attachment 92735 [details] Switching to use rgba(0,0,0,0) instead of 'transparent' doesn't work around this

Mihnea Ovidenie

Comment 2 2011-05-08 23:25:19 PDT

(In reply to comment #1) > Created an attachment (id=92735) [details] > Switching to use rgba(0,0,0,0) instead of 'transparent' doesn't work around this Hi, What version of nightly are you using? I have made a small sample: <html> <style> #SEL { border: 1px solid; border-color: transparent; } #SEL1 { border: 1px solid; border-color: rgba(0,0,0,0); } #SEL2 { border: 1px solid; border-color: black; } </style> <body> <select id="SEL"> <option>A</option> <option>B</option> <option>C</option> </select> <select id="SEL1"> <option>A</option> <option>B</option> <option>C</option> </select> <select id="SEL2"> <option>A</option> <option>B</option> <option>C</option> </select> </body> </html> In this sample, the border for the first 2 select items is gone. Maybe i am missing your point? Regards,

PlasticLawnDaemon

Comment 3 2011-05-09 14:57:45 PDT

Created attachment 92858 [details] Screenshot of code from comment #2 (In reply to comment #2) > (In reply to comment #1) > In this sample, the border for the first 2 select items is gone. Maybe i am missing your point? For me your sample still shows the border in all 3 select items in Chromium 13.0.759.0 (84568) I should mention I'm using the Windows Classic theme in XP if that matters. I put your code into the URL field for others to check.

Mihnea Ovidenie

Comment 4 2011-05-09 23:57:26 PDT

(In reply to comment #3) > Created an attachment (id=92858) [details] > Screenshot of code from comment #2 > > (In reply to comment #2) > > (In reply to comment #1) > > In this sample, the border for the first 2 select items is gone. Maybe i am missing your point? > > For me your sample still shows the border in all 3 select items in Chromium 13.0.759.0 (84568) > I should mention I'm using the Windows Classic theme in XP if that matters. > > I put your code into the URL field for others to check. Can you reproduce this bug in WebKit nightly? I have never tested this with Chromium.

PlasticLawnDaemon

Comment 5 2011-05-10 00:57:20 PDT

Unzipping WebKit from r86085.zip">http://builds.nightly.webkit.org/files/trunk/win/WebKit-SVN-r86085.zip and running it produced this alert: "Safari not found. Safari must be installed to run a WebKit nightly. You can download Safari from .. etc." Ok, so I did that, being careful not to let the installer bloat up my system by including anything other than just Safari which I didn't intend to keep, like Quicktime/updater, then I got: "Safari can't open. Your copy of Safari is missing important software resources. Please reinstall Safari". Sigh. So I'm guessing that Chromium not using Qt widgets for form elements is the real cause of this bug?

PlasticLawnDaemon

Comment 6 2011-05-10 01:04:16 PDT

Looks like someone already filed it for Chromium: http://code.google.com/p/chromium/issues/detail?id=57001

PlasticLawnDaemon

Comment 7 2011-05-10 01:17:24 PDT

Created attachment 92927 [details] Workaround using border:0

Note You need to log in before you can comment on or make changes to this bug.