[beta] Improve example for Applied Visual Design: Use the Strong Tag to Make Text Bold

Challenge use-the-strong-tag-to-make-text-bold has an issue. User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36.

I see the value of this challenge, but I think the example could be improved. How about if we instead of make campers highlight the h4-tag, that already gets font-weight: bold automatically (since it’s a heading), make campers add <strong> around some word in the paragraph?

This way, the effect of the <strong>-tag would be easier to see.

<style>
h4 {
  text-align: center;
  height: 25px;
}
p {
  text-align: justify;
}
.links {
  text-align: left;
  color: black;
}
.fullCard {
  width: 245px;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px 5px;
  padding: 4px;
}
.cardContent {
  padding: 10px;
}
.cardText {
  margin-bottom: 30px;
}
</style>
<div class="fullCard">
<div class="cardContent">
  <div class="cardText">
    <strong><h4>Google</h4></strong>
    <p>Google was founded by Larry Page and Sergey Brin while they were Ph.D. students at Stanford University.</p>
  </div>
  <div class="cardLinks">
    <a href="https://en.wikipedia.org/wiki/Larry_Page" class="links">Larry Page</a><br><br>
    <a href="https://en.wikipedia.org/wiki/Sergey_Brin" class="links">Sergey Brin</a>
  </div>
</div>
</div>

    ```
    

[ajain17]

Ok. I will work on this. Will follow @systimotic’s suggestion. Thanks.

[systimotic]

How about wrapping “Stanford University”? I’m suggesting this because Google and the founder’s names both appear twice, which is bound to cause confusion.