html - Proper CSS Code For Id Selector Not Type Or Class For A Certain Event

Question

I have two spans. Each span has an id tag. I don't want the spans to have a class tag. I want to use css to underline the text in the span when the mouse hovers over it. What is the proper code to do this on a single line in my css file?

<span id=spanImagePreview1>Text Here <img src=url></span>
<span id=spanImagePreview2>Text Here <img src=url></span>

Answer 1

Use a selector that matches both elements:

#spanImagePreview1:hover, #spanImagePreview2:hover { text-decoration: underline; }

Demo: http://jsfiddle.net/Guffa/9RxEb/

Answer 2

mutliple options:

if you have only these two spans: span:hover {text-decoration:underline;}

if they are descendants of a specific element #element span:hover {text-decoration:underline;}

if the spans you have have a pattern for their id try span[id*="spanImagePreview"] {text-decoration:underline;}