SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Apr 2003
    Location
    UK
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    apply css rules if a parent has a specific class?

    Is it possible to say

    if (any parent has class X) AND (we have class Y)
    {style...}

    I'm trying to style a couple of tables (containing tabular data, not layout) in a Drupal view. I need to be able to style these tables separatelyeach other and from other views which share the style sheet. I can drop a class name into a parent to allow me to pick up report specific classes and therefore apply unique styling to each report, however, I can't seem to be able to get my head round how to pick up each table on this report.

    The div's are nested and generated dynamically as required by the views system, so I don't necesserally have a known structure other than my class will be in one of the higher level div's making a nth-child impossible. Unfortunately there's no facility to drop a class or id into the table tag or the parent wrapper.

    The report is destined to be a printed report, so no option to run any script to tweak the DOM.

    The structure is

    body
    div - outer wrapper
    div - view wrapper - I can drop a class name in here
    div
    div
    table - I can't drop a class or id here
    div
    div
    table - I can't drop a class or id here


    Any suggestion?

    I may be able to rewrite the report to output the raw tabular data and style into a table, but this seems overkill.

    The system is on a customer box, so I can't provide a link to the main site - sorry.

  2. #2
    SitePoint Addict sdleihssirhc's Avatar
    Join Date
    Feb 2009
    Posts
    387
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I think what you're after is pretty simple:

    Code CSS:
    .x .y {
        /* ... */
    }

    That will apply styles to any element with a class of "y" that has a parent with a class of "x".
    I'm the web overlord for Graphic Business Systems

  3. #3
    SitePoint Member
    Join Date
    Apr 2003
    Location
    UK
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks,

    That will work with a direct parent, but what about further up the chain? I can only drop the class into an outer wrapper not the direct parent.

  4. #4
    SitePoint Wizard
    Join Date
    Dec 2003
    Location
    USA
    Posts
    2,582
    Mentioned
    29 Post(s)
    Tagged
    0 Thread(s)
    It doesn't matter if it's a direct parent.

    Code:
    .x .y {}
    will hit anything that has .y and is in something that has .x somewhere up the chain.

    Code:
    .x>.y {}
    will hit anything has has .y and it's direct parent is .x.

  5. #5
    SitePoint Member
    Join Date
    Apr 2003
    Location
    UK
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Excellent, that seems to be doing the trick, many thanks


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •