Temnis Posted September 14, 2014 Share Posted September 14, 2014 (edited) Hey guys! I have a simple problem. I have a html table with some stuff in it: <table id="selectable"> <th> some stuff </th> <tr><td> some stuff </td></tr> <tr><td> some stuff </td></tr> <tr><td> some stuff </td></tr></table> Now I have some CSS for all tables on my webpage, and some CSS for all tables with id="selectable". table { position: relative; margin-right: auto; margin-left: auto; width: auto;}#selectable table { position: relative; margin-right: 0px; margin-left: 0px; width: 100%;} BUT the table is always styled with the properties of table {...}, instead of the properties of #selectable table {...} and I have no clue why. What am I doing wrong? Edited September 14, 2014 by Temnis Link to comment Share on other sites More sharing options...
niche Posted September 14, 2014 Share Posted September 14, 2014 try: #selectable { position: relative; margin-right: 0px; margin-left: 0px; width: 100%;} Link to comment Share on other sites More sharing options...
Ingolme Posted September 14, 2014 Share Posted September 14, 2014 The reason it doesn't work is because #selectable table looks for tables inside the #selectable element. To look for tables with selectable as an id you can use the table#selectable selector. To look for any element with selectable as an id #selectable is good enough. Read the W3schools tutorial for more information about CSS selectors. Link to comment Share on other sites More sharing options...
Temnis Posted September 14, 2014 Author Share Posted September 14, 2014 This helped a lot! Looks like I didn't really understand how selectors work. Thank you very much! Problem solved! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now