SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard DoubleDee's Avatar
    Join Date
    Aug 2010
    Location
    Arizona
    Posts
    3,786
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Problem with Selectors

    So close to a larger solution, but stuck on this little issue...

    I have this HTML...

    Code HTML4Strict:
    <p><span class="byline"><b>2 days ago - by Kate Shaw</b> | Posted in: Nobel Intent</span></p>
    <p>
    	Individuality increases with group size in rodents, making it
    	easier to recognize group members among lots of potential targets.
    </p>

    I want to apply a Bottom Margin only when there is a <P> by itself.

    If there is a <P> tag and something else (e.g. "<p><span class="byline">") then the Bottom Margin I define here...

    Code CSS:
    p{
    	margin: 0.2em 0 2em 0;
    	font: 0.8em/1.3 arial;
    }

    should be ignored!!!

    How do I do that??



    Debbie
    Last edited by descarte; Mar 7, 2011 at 08:53.

  2. #2
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    If there is a <P> tag and something else (e.g. "<p><span class="byline">") then the Bottom Margin I define here... should be ignored!!!
    No it shouldn't, the <p> tag is not capable of checking to see if there is a span in it and then changing it's margins if a span present.
    What your asking for there is what would be called a Parent Selector and it's not available with CSS.

    How do I do that??
    Put the class back on the <p> like I had already done in my last example from your related thread.

    The reasons I did that were twofold :
    1) for margin differences
    2) and text styling

    Nesting every bit of text in the span from the opening to the closing of the <p> makes that a useless span.

    It's not adding anymore styling ability than the p-class could not have handled on it's own.

  3. #3
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,888
    Mentioned
    122 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by DoubleDee View Post
    So close to a larger solution, but stuck on this little issue...

    I have this HTML...

    Code HTML4Strict:
    <p><span class="byline"><b>2 days ago - by Kate Shaw</b> | Posted in: Nobel Intent</span></p>
    <p>
    	Individuality increases with group size in rodents, making it
    	easier to recognize group members among lots of potential targets.
    </p>

    I want to apply a Bottom Margin only when there is a <P> by itself.

    If there is a <P> tag and something else (e.g. "<p><span class="byline">") then the Bottom Margin I define here...

    Code CSS:
    p{
    	margin: 0.2em 0 2em 0;
    	font: 0.8em/1.3 arial;
    }

    should be ignored!!!
    If the <span> spans the whole of the <p>, why not save yourself a tag and put a class on the <p> instead? Then you can simply override any general paragraph styling with p.byline {...}


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
  •