TheGlamGeek/animal-trading-card-lion.markdown

## animal-trading-card-lion.markdown

      
    Raw
  

              animal-trading-card-lion.markdown
            
          
    Animal Trading Card: Lion

A Pen by CodeToya on CodePen.
License.

  
## index.html
<html>
<head>
	<meta charset="utf-8">
	<title>Animal Trading Cards</title>
	<link rel="stylesheet" href="AnimalCard.css" title="stylesheet" type="text/css"/>
<link rel="import" href="chrome-extension://melpgahbngpgnbhhccnopmlmpbmdaeoi/app/templates/feedback.html" id="udacity-test-widget" ><script id="ud-grader-options">UdacityFEGradingEngine.turnOn();</script></head>
<body>
	<div id="cardcontent" class="infosection">
		<!-- your favorite animal's name goes here -->
		<div id="image" >
		<h3>Lion</h3>
		<!-- your favorite animal's image goes here -->

		<img src="http://res.cloudinary.com/codetoya/image/upload/v1519756354/lioncard_ruxwav.jpg" alt="The Majestic Lion" width="320px" class="pic">
	</div>

		<div class="infosection">
			<!-- your favorite animal's interesting fact goes here -->
			<p id="interfact">Lion's are considered to be the second-largest living cat species after the tiger.</p>
			<ul class="infolist">
				<!-- your favorite animal's list items go here -->
				<li><span class="label"> Scientific Name</span>: Panthera Leo</li>
				<li><span class="label">Average Size</span>:
					<ul>Male: 3.9 ft, 420lbs</ul>
					<ul>Female: 3.6ft, 280lbs</ul>
				</li>
				<li><span class="label">Average Lifespan</span>: 10-14 Years</li>
				<li><span class="label">Habitat</span>: Grasslands and Savannahs</li>
			</ul>
			<!-- your favorite animal's description goes here -->
			<p>In the wild, they can live up to 14 years. Lions range in color from yellow to dark brown, with a long tail that ends in a furry black tuft. The male lion is unique among the cat species for its thick mane of hair encircling the neck and head. Both males and females roar, a sound that can be heard from five miles away. The have the loudest roar of any cat species!</p>
		</div>
	</div>

## style.css

#cardcontent {
  width: 340px;
  height:auto;
  margin: 0 auto;
  border-radius: 15px 50px;

}

.infosection {
  border: 1px solid black;
  padding: 10px;
  width: 300px;
  margin: auto;
  border-radius: 15px 50px;
}

#image{
  padding: 10px;
  width: 300px;
  border: 1px solid transparent;
  border-radius: 15px 50px;
}

#interfact {
  font-style: italic;
}

.label {
  font-weight: bold;
}

.infolist {
  list-style: none;
}

.pic {
  border-radius: 15px 50px;
}
	<html>
	<head>
	<meta charset="utf-8">
	<title>Animal Trading Cards</title>
	<link rel="stylesheet" href="AnimalCard.css" title="stylesheet" type="text/css"/>
	<link rel="import" href="chrome-extension://melpgahbngpgnbhhccnopmlmpbmdaeoi/app/templates/feedback.html" id="udacity-test-widget" ><script id="ud-grader-options">UdacityFEGradingEngine.turnOn();</script></head>
	<body>
	<div id="cardcontent" class="infosection">
	<!-- your favorite animal's name goes here -->
	<div id="image" >
	<h3>Lion</h3>
	<!-- your favorite animal's image goes here -->

	<img src="http://res.cloudinary.com/codetoya/image/upload/v1519756354/lioncard_ruxwav.jpg" alt="The Majestic Lion" width="320px" class="pic">
	</div>

	<div class="infosection">
	<!-- your favorite animal's interesting fact goes here -->
	<p id="interfact">Lion's are considered to be the second-largest living cat species after the tiger.</p>
	<ul class="infolist">
	<!-- your favorite animal's list items go here -->
	<li><span class="label"> Scientific Name</span>: Panthera Leo</li>
	<li><span class="label">Average Size</span>:
	<ul>Male: 3.9 ft, 420lbs</ul>
	<ul>Female: 3.6ft, 280lbs</ul>
	</li>
	<li><span class="label">Average Lifespan</span>: 10-14 Years</li>
	<li><span class="label">Habitat</span>: Grasslands and Savannahs</li>
	</ul>
	<!-- your favorite animal's description goes here -->
	<p>In the wild, they can live up to 14 years. Lions range in color from yellow to dark brown, with a long tail that ends in a furry black tuft. The male lion is unique among the cat species for its thick mane of hair encircling the neck and head. Both males and females roar, a sound that can be heard from five miles away. The have the loudest roar of any cat species!</p>
	</div>
	</div>

	#cardcontent {
	width: 340px;
	height:auto;
	margin: 0 auto;
	border-radius: 15px 50px;

	}

	.infosection {
	border: 1px solid black;
	padding: 10px;
	width: 300px;
	margin: auto;
	border-radius: 15px 50px;
	}

	#image{
	padding: 10px;
	width: 300px;
	border: 1px solid transparent;
	border-radius: 15px 50px;
	}

	#interfact {
	font-style: italic;
	}

	.label {
	font-weight: bold;
	}

	.infolist {
	list-style: none;
	}

	.pic {
	border-radius: 15px 50px;
	}