diff --git a/zoo-css-challenge/README.md b/zoo-css-challenge/README.md index ef30e833..2b514a57 100644 --- a/zoo-css-challenge/README.md +++ b/zoo-css-challenge/README.md @@ -2,13 +2,13 @@ You have been hired by a zoo to build a website. -I’ve done the first part but it is full of mistakes. It’s your job to fix them. The client has sent over a list of alterations and recommendations that they want to fix the site with. +I’ve done the first part but it is full of mistakes. It’s your job to fix them. The client has sent over a list of alterations and recommendations that they want to fix the site with. You are encouraged to use Google to help you find the answers to these problems. ## 1) Introduction -First of all, we don’t want the logo to have a purple border. The logo has an ID of logo, make sure this has no border. +First of all, we don’t want the logo to have a purple border. The logo has an ID of logo, make sure this has no border. CHECK The first section has a class name of ‘introduction’. Give this section a white background. Add a paragraph to this section with the following text: diff --git a/zoo-css-challenge/index.html b/zoo-css-challenge/index.html index 0892fd58..a03dc6b2 100644 --- a/zoo-css-challenge/index.html +++ b/zoo-css-challenge/index.html @@ -1,136 +1,222 @@ - - - - -
- - -
-
-
-

Birmingham Zoo

-
- -
-

Opening 2021!

-
- -
-

Bears

-

Did you know that a bear's closest relative is the seal? Or that bears can smell over 2,000 times better than humans?

-
- Grizzly Bear - Grizzly Bear - Grizzly Bear -
-
- -
-

Tiger

-

Top 5 Tiger Facts

-
    -
  1. Tigers are the largest cat species in the world reaching up to 3.3 meters in length and weighing up to 670 pounds! -
  2. Tigers are easily recognizable with their dark vertical stripes and reddish/orange fur. -
  3. The Bengal tiger is the most common tiger. -
  4. Tigers live between 20-26 years in the wild. -
  5. Unlike most other cats, tigers are great swimmers and actually like the water. -
-
- -
-

Giraffe

- -

Giraffes are the world's tallest mammals, thanks to their towering legs and long necks. A giraffe's legs alone are taller than many humans—about 6 feet . These long legs allow giraffes to run as fast as 35 miles an hour over short distances and cruise comfortably at 10 miles an hour over longer distances.

- -

Behavior

- -

Typically, these fascinating animals roam the open grasslands in small groups of about half a dozen.

- -

Bulls sometimes battle one another by butting their long necks and heads. Such contests aren't usually dangerous and end when one animal submits and walks away.

- -

Height and Size

- -

Giraffes use their height to good advantage and browse on leaves and buds in treetops that few other animals can reach (acacias are a favorite). Even the giraffe's tongue is long! The 21-inch tongue helps them pluck tasty morsels from branches. Giraffes eat most of the time and, like cows, regurgitate food and chew it as cud. A giraffe eats hundreds of pounds of leaves each week and must travel miles to find enough food.

-
- -
-

News

-
- -

Helping wild turtles in Seychelles

- Find out More -
-
- -

Learning about the rainforest

- Find out More -
-
- -
-
-

Learning resources for schools

-

Explore our activities, videos, and lesson plans to support a wide range of curriculum topics

- -
-
- -
-

Are there any benefits or discounts for members?

-

There are AMAZING benefits of becoming a member with Birmingham Zoo! Our members get special discounts in our shops, cafes, and unlimited entry

- -
- -
-

Programs

-
-

Children and Family Programs

- Find out More -
-
-

Adult Programs

- Find out More -
-
-

Youth and young adults

- Find out More -
-

Useful Links

-

-

- w3schools.com - National Geographic - Wikipedia -
- -
- + + ZOO121 + + + +
+ + +
+
+
+

Birmingham Zoo

+

+ The zoo is open every day of the year and features three major biomes: + the Tropic Zone, Temperate Territory, and the Polar Circle. From + tropical birds, to snow leopards, grizzly bears, and one of the + nation’s largest colonies of Antarctic penguins, there are animals to + enjoy in every season. +

+
+ +
+

Opening 2021!

+
+ +
+

Bears

+

+ Did you know that a bear's closest relative is the seal? Or that bears + can smell over 2,000 times better than humans? +

+
+ Grizzly Bear + + Grizzly Bear + + Grizzly Bear +
+
+ +
+

Tiger Facts

+ + +
+ +
+

Giraffe

+ +

+ Giraffes are the world's tallest mammals, thanks to their towering + legs and long necks. A giraffe's legs alone are taller than many + humans—about 6 feet . These long legs allow giraffes to run as fast as + 35 miles an hour over short distances and cruise comfortably at 10 + miles an hour over longer distances. +

+ +

Behavior

+ +

+ Typically, these fascinating animals roam the open grasslands in small + groups of about half a dozen. +

+ +

+ Bulls sometimes battle one another by butting their long necks and + heads. Such contests aren't usually dangerous and end when one animal + submits and walks away. +

+ +

Height and Size

+ +

+ Giraffes use their height to good advantage and browse on leaves and + buds in treetops that few other animals can reach (acacias are a + favorite). Even the giraffe's tongue is long! The 21-inch tongue helps + them pluck tasty morsels from branches. Giraffes eat most of the time + and, like cows, regurgitate food and chew it as cud. A giraffe eats + hundreds of pounds of leaves each week and must travel miles to find + enough food. +

+
+ +
+

Lion

+ +

+ Lions are large carnivorous mammals known as the "kings of the + jungle," although they mainly live in grasslands and savannas. They + are social animals that live in groups called prides, which usually + consist of related females, their cubs, and a few adult males. Lions + are powerful hunters and play a crucial role in maintaining the + balance of their ecosystems. +

+ + +
+ +
+

News

+
+ +

Helping wild turtles in Seychelles

+ Find out More +
+
+ +

Learning about the rainforest

+ Find out More +
+
+ +

Which big cat are you?

+ Find out More +
+
+ +
+
+

Learning resources for schools

+

+ Explore our activities, videos, and lesson plans to support a wide + range of curriculum topics +

+ +
+
+ +
+

Are there any benefits or discounts for members?

+

+ There are AMAZING benefits of becoming a member with + Birmingham Zoo! Our members get special discounts in our shops, cafes, + and unlimited entry +

+ +
+ +
+

Programs

+
+

Children and Family Programs

+ Find out More +
+
+

Adult Programs

+ Find out More +
+
+

Youth and young adults

+ Find out More +
+

Useful Links

+

+ w3schools.com + National Geographic + Wikipedia +
+
+ - \ No newline at end of file + diff --git a/zoo-css-challenge/style.css b/zoo-css-challenge/style.css index b9007645..5dba739b 100644 --- a/zoo-css-challenge/style.css +++ b/zoo-css-challenge/style.css @@ -2,6 +2,10 @@ font-family: sans-serif; } +p, li { + line-height: 35px; +} + header { background-color: #211a1d; color: #ffffff; @@ -29,10 +33,11 @@ section { background-color: #f8f0fb; } -img { - border: 5px solid #8075ff; +#dakt { + color: #81DFE4; } + h1, h2, h3, @@ -57,13 +62,14 @@ h3 { button { display: inline-block; - border-radius: 3px; + border-radius: 5px; cursor: pointer; - padding: 10px 20px; + padding: 10px 40px; box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2); background-color: #372772; border: 2px solid black; color: #fff; + } footer { @@ -76,26 +82,32 @@ footer { } .introduction { + background-color: white; } #badge { height: 120px; width: 120px; - background-color: #bbb; + background-color: #51b8e88c; border-radius: 50%; display: inline-block; position: fixed; bottom: 20px; right: 20px; - + top: 20px; display: flex; justify-content: center; align-content: center; flex-direction: column; + color: #0d101195; + transition: 3s; } #badge:hover { - background-color: yellow; + background-color: #e5650a; + height: 150px; + width: 150px; + color: #eeeeee; } #badge p { @@ -103,27 +115,39 @@ footer { font-size: 125%; } -.image-container img { +img { vertical-align: top; - border: 5px solid #747c92; -} - -.image-container img:first-of-type { - vertical-align: bottom; + border: 5px solid; } .tigers { - background-color: #0b3c49; - color: #f0e100; + background-color: #0a313c; + color:#BEEE62; } .giraffe { - background-color: #465775; + background-color:#483C46; color: #56e39f; } -.giraffe h2 { - color: #ef6f6c; +#tg1, #tg2, #tg3 { + color:#F4743B; +} + +.pgiraffe { + color: #BEEE62; +} + +.lion{ + background-color: #0a313c; + color:#BEEE62; +} + +#liont{ + color: #81DFE4; +} +.news{ + text-align: center; } .card { @@ -131,7 +155,7 @@ footer { background-color: white; padding: 20px; margin: 10px; - width: 30%; + width: 25%; border: 1px solid black; border-radius: 10px; } @@ -177,7 +201,9 @@ footer { .membership { text-align: center; + max-width: 700px; background-color: #fffffc; + margin: auto; } .membership h2 { @@ -190,6 +216,6 @@ footer { /*Programs*/ -.programs .card { - display: block; +.programs { + display:block; }