1

I am trying to make the following selector work with my HTML: 

input[type="submit"][value=" "]:not(.unwantedIconClass)/*, thisIsAComment*/

It will not work unless I replace value with actual text (and have the same text in the HTML, of course).

I have tried \007C\00a0\00a0 following advice from nbsp not working in CSS content tag but it does not seem to work either and makes Eclipse syntax coloring confused.

What I actually want is for the value to be invisible to the user but selectable using CSS. It does not matter what the value actually is. This is because I do not have control about the input tag, only its value attribute.

Any suggestions ?

EDIT -- Since it is part of the problem, I will explain more: The value of my value attribute is actually generated through a custom JSP tag, and that custom JSP tag is enclosed by a layout:submit attribute (Struts Layout).

<layout:submit 
    styleClass="tooCommonClass"
    reqCode="notAReliableIdentifierEither">
    <customTag:message key="keyToPropertyFile" />
</layout:submit>
Community
  • 1
  • 1
Toto
  • 397
  • 6
  • 17
  • `\007C\00a0\00a0` corresponds to | followed by *two* no-break spaces as given in the question, not just a single no-break space. That would be simply \00a0. Can't comment on the syntax coloring issue. – BoltClock Oct 01 '15 at 15:46
  • Unfortunately \00a0 does not work either :/ I think the JSP tag used has some responsibility in it, but not much I can do about it. – Toto Oct 01 '15 at 16:17
  • *If a graphical button is needed (a button with an image), then the `image` tag is more appropriate.* - http://www.jajakarta.org/struts/struts1.2/documentation/ja/target/userGuide/struts-html.html#submit. – Aleksandr M Oct 01 '15 at 19:48

1 Answers1

2

Just use the empty string for value.

input[type="submit"][value=""] {
    background-color: orange;
}

input[type="submit"][value="_"] {
    background-color: purple;
    font-size: 0;
    color: transparent;
}
<input type="submit" value="" />
<input type="submit" value="Submit" />
<input type="submit" value="_" />
Jacob
  • 2,212
  • 1
  • 12
  • 18
  • I'm not sure if it is a behavior of the user agent or the behavior of the enclosing JSP tag, but I cannot put a blank "value" attribute to the submit tag because this will display "Submit" inside the button. What I want is no text and an icon displayed thanks to CSS (if the selector worked). I have to avoid modifying the HTML if ever possible. – Toto Oct 01 '15 at 16:14
  • Probably JSP. I tested in Chrome, FF, and IE11 and it's fine. You could use an arbitrary `value` and change `color` to `transparent` or `font-size` to `0` to hide the text. – Jacob Oct 01 '15 at 16:17
  • font-size 0 I have read is unreliable, but thanks for the other suggestion, I will try it and post an update. – Toto Oct 01 '15 at 16:30