newt
newt

Reputation: 23

css selector question

I have a table that looks something like this.

EDIT - I re-extracted code. I think the question makes more sense now. (Answers may not)

  <div class="view view-latest-news-view view-id-latest_news_view view-display-id-latest_news_block_1 view-dom-id-1">
     <div class="views-admin-links views-hide">
     </div>
  <div class="view-content">
  <table class="views-view-grid">
     <tr class="row-1 row-first">
        <td class="col-1">
        </td>
     </tr>   
  <table>
  </div>
</div>   

How can I address only the "views-view-grid" tables that are contained by the "view-latest-news-view" class? Something like this...

.view-latest-news-view table.views-view-grid  {
    border-collapse:separate;
    border: 1px solid red;
}

** END EDIT **

Thanks!

** ANSWER: ** this works... but maybe I could be more specific?

.view-latest-news-view .views-view-grid  {
    border-collapse:separate;
    border: 1px solid red;
}

Upvotes: 0

Views: 91

Answers (2)

cdhowie
cdhowie

Reputation: 168988

This does not work because <table class="views-generic-grid"> is not contained with in any element with the class views-admin-links. (You open the div and then immediately close it, so it has no children.)

So when you say this:

How can I address only the "views-generic-grid" tables that are contained by the "views-admin-links" class?

The answer is you can't, because there are no "views-generic-grid" tables contained in elements with the "views-admin-links" class.

Either extend the div to surround the table, or pick a different selector than .views-admin-links.

Upvotes: 2

Alex
Alex

Reputation: 65944

The way your markup is right now, you can't, you have to extend .views-admin-links to surround the entire .views-generic-grid table, and then you can write a selector like this:

.views-admin-links .views-generic-grid

Upvotes: 0

Related Questions