This is the component:

<aura:component implements='force:appHostable'>
    <h1 class="headline">My Lightning Component</h1>
</aura:component>

This is the app:

<aura:application >
    <h1>Hello Lightning App!</h1>
    <c:MyLightningComponent />
</aura:application>

This is the CSS:

.THIS{  
}

h1.THIS.headline {
    font-size:24px;
}

To me it seems to be doing what is it supposed to be doing. Which is "The component must include an H1 tag with a CSS class named 'headline'. The 'headline' CSS class must set a font-size of 24px."
Yet it complains that "The component is not using the correct CSS for the 'headline' class".
Anyone an idea of what I am doing wrong.
Much appreciated in advance.

 

I cannot for the life of me, figure out what could be wrong with my campingList component markup for the "Create a Simple Camping List Lightning Component" challenge.  This is the markup for campingList.cmp:

<aura:component>
     <ul>
        <li>Bug Spray</li>
        <li>Bear Repellant</li>
        <li>Goat Food</li>
    </ul>
 </aura:component>

Please help me figure out why I am getting the error.  Thank you, Susan

 

This is the component:

<aura:component implements='force:appHostable'>
    <h1 class="headline">My Lightning Component</h1>
</aura:component>

This is the app:

<aura:application >
    <h1>Hello Lightning App!</h1>
    <c:MyLightningComponent />
</aura:application>

This is the CSS:

.THIS{  
}

h1.THIS.headline {
    font-size:24px;
}

To me it seems to be doing what is it supposed to be doing. Which is "The component must include an H1 tag with a CSS class named 'headline'. The 'headline' CSS class must set a font-size of 24px."
Yet it complains that "The component is not using the correct CSS for the 'headline' class".
Anyone an idea of what I am doing wrong.
Much appreciated in advance.