Confused about placement of box-shadow property

im not sure where to insert the box-shadow property with the Id… can someone help me out? do i put it before or after the id?

  **Your code so far**

<style>
h4 {
  text-align: center;
  background-color: rgba(45, 45, 45, 0.1);
  padding: 10px;
  font-size: 27px;
}
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;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
.cardContent {
  padding: 10px;
}
.cardText {
  margin-bottom: 30px;
}
</style>
<div class="fullCard" id box-shadow ="thumbnail">
<div class="cardContent">
  <div class="cardText">
    <h4>Alphabet</h4>
    <hr>
    <p><em>Google was founded by Larry Page and Sergey Brin while they were <u>Ph.D. students</u> at <strong>Stanford University</strong>.</em></p>
  </div>
  <div class="cardLinks">
    <a href="https://en.wikipedia.org/wiki/Larry_Page" target="_blank" class="links">Larry Page</a><br><br>
    <a href="https://en.wikipedia.org/wiki/Sergey_Brin" target="_blank" class="links">Sergey Brin</a>
  </div>
</div>
</div>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36

Challenge: Add a box-shadow to a Card-like Element

Link to the challenge:

box-shadow is a style property(css). You must list it alongside other css parameters like padding, margin, border etc. In the example the element we must apply box-shadow has an id thumbnail. You want to style that id in your css(styles section). Recall how to create an id selector in the styles section of your code and use the example box-shadow code to apply it for that id selector. That way the element with the id thumbnail will get the respective style applied. You dont want to use the box-shadow property inline(i.e. not in the html element description).

okay but im still stuck i did
id { `
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
but it wont do anything

that is not how you target an id via its element in the styles. I suggest you go back to id lessons and recall how to target the element with id “thumbnail” in your styles. Its similar to how we target a class, only the symbol which differs class from id is different.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.