Skip to content

Benji's Fixes #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
BenjaM0708 wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Benji's Fixes #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
289db33
Changes
BenjaM0708 Dec 14, 2025
428063c
Second Try
BenjaM0708 Dec 14, 2025
8b527f7
Final Try
BenjaM0708 Dec 14, 2025
c4b7ce8
Now Yes
BenjaM0708 Dec 14, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions zoo-css-challenge/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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:

Expand Down
352 changes: 219 additions & 133 deletions zoo-css-challenge/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,136 +1,222 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<img src='https://sharp-villani-e65ba8.netlify.app/zoo.svg'
alt="zoo logo"
id="logo"
>
<nav>
<ul>
<li>Directions</li>
<li>Food & Drink</li>
<li>Education</li>
<li>Your Visit</li>
</ul>
</nav>
</header>
<main>
<section class="introduction">
<h1>Birmingham Zoo</h1>
</section>

<div id="badge">
<p>Opening 2021!</p>
</div>

<section class="bears">
<h2>Bears</h2>
<p>Did you know that a bear's closest relative is the seal? Or that bears can smell over 2,000 times better than humans?</p>
<div class="image-container">
<img
src="https://placebear.com/200/300"
alt="Grizzly Bear"
width="200"
height="300"
>
<img src="https://placebear.com/400/300"
alt="Grizzly Bear"
width="400"
height="300"
>
<img src="https://placebear.com/200/400"
alt="Grizzly Bear"
width="200"
height="400"
>
</div>
</section>

<section class="tigers">
<h2>Tiger</h2>
<h3>Top 5 Tiger Facts</h3>
<ol>
<li>Tigers are the largest cat species in the world reaching up to 3.3 meters in length and weighing up to 670 pounds!
<li>Tigers are easily recognizable with their dark vertical stripes and reddish/orange fur.
<li>The Bengal tiger is the most common tiger.
<li>Tigers live between 20-26 years in the wild.
<li>Unlike most other cats, tigers are great swimmers and actually like the water.
</ol>
</section>

<section class="giraffe">
<h2>Giraffe</h2>

<p>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.</p>

<h3>Behavior</h3>

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

<p>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.</p>

<h3>Height and Size</h3>

<p>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.</p>
</section>

<section class="news">
<h2>News</h2>
<div class="card">
<time>2010-04-16</time>
<h4>Helping wild turtles in Seychelles</h4>
<a>Find out More</a>
</div>
<div class="card">
<time>2010-04-12</time>
<h4>Learning about the rainforest</h4>
<a>Find out More</a>
</div>
</section>

<section class="education">
<div class="education-container">
<h3>Learning resources for schools</h3>
<p>Explore our activities, videos, and lesson plans to support a wide range of curriculum topics</p>
<button>Find them here</button>
</div>
</section>

<section class="membership">
<h2>Are there any benefits or discounts for members?</h2>
<p>There are <strong>AMAZING</strong> benefits of becoming a member with Birmingham Zoo! Our members get special discounts in our shops, cafes, and unlimited entry</p>
<button>Learn More</button>
</section>

<section class="programs">
<h2>Programs</h2>
<div class="card">
<h4>Children and Family Programs</h4>
<a>Find out More</a>
</div>
<div class="card">
<h4>Adult Programs</h4>
<a>Find out More</a>
</div>
<div class="card">
<h4>Youth and young adults</h4>
<a>Find out More</a>
</div>
<h3>Useful Links</h3>
<p>
</p>
<a href="https://www.w3schools.com">w3schools.com</a>
<a href="https://www.nationalgeographic.com/" target="_blank">National Geographic</a>
<a href="http://www.wikipedia.org" target="_top">Wikipedia</a>
</section>

</main>
<footer>
<p>Open Monday-Friday 7am-4pm</p><address>1 Birmingham Road</address>
</footer>
<head>
<title>ZOO121</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<img
src="https://sharp-villani-e65ba8.netlify.app/zoo.svg"
alt="zoo logo"
id="logo"
/>
<nav>
<ul>
<li>Directions</li>
<li>Food & Drink</li>
<li>Education</li>
<li>Your Visit</li>
</ul>
</nav>
</header>
<main>
<section class="introduction">
<h1>Birmingham Zoo</h1>
<p>
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.
</p>
</section>

<div id="badge">
<p>Opening 2021!</p>
</div>

<section class="bears">
<h2>Bears</h2>
<p>
Did you know that a bear's closest relative is the seal? Or that bears
can smell over 2,000 times better than humans?
</p>
<div class="image-container">
<img
src="https://placebear.com/200/300"
alt="Grizzly Bear"
width="200"
height="300"
style="border-color: #094842"
/>

<img
src="https://placebear.com/400/300"
alt="Grizzly Bear"
width="400"
height="300"
style="border-color: #1486b3"
/>

<img
src="https://placebear.com/200/400"
alt="Grizzly Bear"
width="200"
height="300"
style="border-color: #03645a"
/>
</div>
</section>

<section class="tigers">
<h2 id="dakt">Tiger Facts</h2>

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

<section class="giraffe">
<h2 id="tg1">Giraffe</h2>

<p class="pgiraffe">
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.
</p>

<h3 id="tg2">Behavior</h3>

<p class="pgiraffe">
Typically, these fascinating animals roam the open grasslands in small
groups of about half a dozen.
</p>

<p class="pgiraffe">
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.
</p>

<h3 id="tg3">Height and Size</h3>

<p class="pgiraffe">
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.
</p>
</section>

<section class="lion">
<h2 id="liont">Lion</h2>

<p>
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.
</p>

<ul>
<li>Lions can weigh up to 250 kilograms (550 pounds).</li>
<li>They are found mainly in sub-Saharan Africa.</li>
<li>Male lions are recognized by their large manes.</li>
<li>Lions can sleep up to 20 hours a day.</li>
<li>
They communicate using roars that can be heard from several
kilometers away.
</li>
</ul>
</section>

<section class="news">
<h2>News</h2>
<div class="card">
<time>2010-04-16</time>
<h4>Helping wild turtles in Seychelles</h4>
<a>Find out More</a>
</div>
<div class="card">
<time>2010-04-12</time>
<h4>Learning about the rainforest</h4>
<a>Find out More</a>
</div>
<div class="card">
<time>2025-14-12</time>
<h4>Which big cat are you?</h4>
<a>Find out More</a>
</div>
</section>

<section class="education">
<div class="education-container">
<h3>Learning resources for schools</h3>
<p>
Explore our activities, videos, and lesson plans to support a wide
range of curriculum topics
</p>
<button>Find them here</button>
</div>
</section>

<section class="membership">
<h2>Are there any benefits or discounts for members?</h2>
<p>
There are <strong>AMAZING</strong> benefits of becoming a member with
Birmingham Zoo! Our members get special discounts in our shops, cafes,
and unlimited entry
</p>
<button>Learn More</button>
</section>

<section class="programs">
<h2>Programs</h2>
<div class="card">
<h4>Children and Family Programs</h4>
<a href="#" target="_blank">Find out More</a>
</div>
<div class="card">
<h4>Adult Programs</h4>
<a href="#" target="_blank">Find out More</a>
</div>
<div class="card">
<h4>Youth and young adults</h4>
<a href="#" target="_blank">Find out More</a>
</div>
<h3>Useful Links</h3>
<p></p>
<a href="https://www.w3schools.com" target="_blank">w3schools.com</a>
<a href="https://www.nationalgeographic.com/" target="_blank"
>National Geographic</a
>
<a href="http://www.wikipedia.org" target="_top">Wikipedia</a>
</section>
</main>
<footer>
<p>Open Monday-Friday 7am-4pm</p>
<address>1 Birmingham Road</address>
</footer>
</body>
</html>
</html>
Loading