<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}
p {
font-size: 16px;
font-family: Monospace;
}
.smaller-image {
width: 100px;
thick-green border
border-color: green;
border-width: 10px;
border-style: solid;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<img class="smaller-image thick-green-border"src="https://bit.ly/fcc-relaxing-cat"alt="A cute orange cat lying on its back. ">
<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
- You have all of your border stuff inside your
smaller-image
class instead of declaring a new class. - Look carefully at the name you used in the style sheet. You have a typo.
heres everything you need to know
let me know if your missing something
Thanks for answering,
However, I’m still confused. Do you mean that I put the two img classes together in the .smaller-image section at the top
}
.smaller-image {
width: 100px;
.thick-green border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
Do I also need to adjust more in the bottom part of the lesson or leave like below?
<img class="smaller-image thick-green-border"src="https://bit.ly/fcc-relaxing-cat"alt="A cute orange cat lying on its back. "> .
How do I separate the two img classes because I tried separating using above but lost the thick gray border that I had? What am I still doing wrong?
If you clarify, I would so appreciate it.
This is still confusing. I’m don’t remember anything like this. You’re saying that this is the code that I put like this:
above or below this:
}
.smaller-image {
width: 100px;
}
Please excuse me but would it be like this:
.classDefNum1 {
sameProperty1: small-image;
sameProperty2: width: 100px:
}
.classDefNum2 {
sameProperty1: thick-green border {
same Property2: width: 10px-solid-radius: 50%;
}
Is this the only way to get a green border?
no not necessarily
at your level this it the code
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
h2 {
font-family: Lobster, Monospace;
}
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}
</style>
<div class="container-fluid">
<div class="row">
<div class="col-xs-8">
<h2 class="text-primary text-center">CatPhotoApp</h2>
</div>
<div class="col-xs-4">
<a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. "></a>
</div>
let me know if you understand
Hi,
Thank you for your kind email. However, I am completely confused to make it work this way. I did get it to work to turn the box green in a different way. I know that your code works, but I am totally stumped as how you did it this way.
Where did the container-fluid come in for this in lesson 19?
I can see dividing the original 16 twice for those two div class lines.
Believe it or not, I even am getting library books out trying to understand this coding. This all is so new to me, but I am trying my hardest. I know that I must seem like a complete idiot but what did you mean here? I keep trying to go over it, but the more that I try, the more I lost I get.
Hi Randall,
You helped me solve that particular lesson. I only went to that same solved lesson because I thought another person was trying to teach me another method to do the same thing. However, I had no idea at all as to how he or she came up with that solution. This is where I got so confused. I am so happy that you said this person was referencing another problem because I assumed I was a complete idiot.
Here’s the lesson that you helped me solve. I am in lesson 85 now. This is what I understand and it works to form the green border from lesson 19:
Thank you so much, Randall, for being so thoughtful.
<p>
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
}
p {
font-size: 16px;
font-family: Monospace;
}
.smaller-image {
width: 100px;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back. ">
<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>
</p>
Got it! I’ll remember that for the future. You take care, Randall, and thanks again!