Cross-Browser Styling CSS Form ID

Question

I have a form marked up like: <form id="some-form">. I have always selected forms using

#some-form { /* declare my css */ }

However, one of my team members said this is not cross-browser or backwards compatible and said I needed to declare my css using syntax something like:

form [id="some=form"] { /* declare my css */ }

Can anyone elaborate on whether this is true? And which browsers / versions will be affected? And what the proper syntax to ensure cross-browser backwards-compatibility? Thanks!

Answer 1

What your team member is describing is the CSS attribute selector. If anything, his/her way of targeting the <form> element would be less backwards compatible as the ability to target elements based on attributes was added in CSS 2.1 while your way of doing it has been around since the beginning. Although less compatible, the market share of browsers that do not support CSS 2.1 is very minimal, and shrinking every day.

See here for more info: http://www.w3.org/TR/CSS2/selector.html#attribute-selectors

Answer 2

selecting elements by id using #someid has been supported since CSS1. So just about every browser that has CSS support should support it.