Tell us what’s happening:
Describe your issue in detail here.
Hello, I am having trouble with two things one is the nav-bar links follow when I scroll the page. I tried fixing the position through class and id. I am quite new at this and not sure what else I can do. The other thing is the paragraphs will not text-align center and I have tried to change this with classes, id’s and even inserted the text-align within the <p> and still no go. I am not sure what more I can do. Please help.
Your code so far
<style>
p {
width: 500px;
height: auto;
text-align: center;
}
body{
text-align: center;
}
div{
text-align: center;
}
.nav-link{
width: 500px%;
height: 40px;
color: black;
text-align: right;
float: ;
background-color: white;
}
.Submit{
}
ul {
}
.navbar-right{
text-align: right;
}
.flex-container {
display: flex;
background-color: white;
}
.flex-container > div {
background-color: #f1f1f1;
margin: 100px;
padding: 100px;
font-size: 30px;
align: center;
}
</style>
<header id= "header" >
<nav id= "nav-bar" >
<ul >
<a href="#wedding" class="nav-link" > <li text-align="center">Wedding</li></a>
<a href="#events" class="nav-link"><li text-align="center">Events</li></a>
<a href="#about" class="nav-link"><li text-align="center">About</li> </a>
<a href="#contact" class="nav-link"><li text-align="center">Contact</li></a>
</nav>
</ul>
<img class= "img-resize" id="header-img" src="https://eventective-media.azureedge.net/2476136_md.jpg" width= "200" height="auto"
</header>
<body>
<h1> Fraser Valley DJ Services </h1>
<div id="wedding">
<h2> Wedding</h2>
<p text-align="center">At Smokin Beatz we have a 7 hour reception package available were we play music for cocktail hour, dinner and the dance music. This package includes microphones, colourful dance lights, tv for music videos, two speakers and a subwoofer. We have a simple itinerary for you to fill out to customize your wedding reception to your liking. I also can help you with suggestions if needed. A ceremony itinerary is also available. Receive a 10% discount if your wedding is on a Friday, Sunday or any other day other than Saturday.</p>
</div>
<div id="events">
<h2> Event</h2>
<p> We provide services for functions such as: Christmas parties, birthdays, grad parties, school dances, high school re-unions and more.
Smokin Beatz has a vast range of music with hits from the 50’s, 60’s, 70’s, 80’s all the way to current hits. The majority of our selection is Rock & Roll, Hip-hop and Country.
We also have background music available for dinner or cocktail hour.</p>
</div>
<div class="flex-container">
<div>Affordable</div>
<div>Reliable</div>
<div>Fun</div>
</div>
<div id="about">
<h2> About</h2>
<p> My name is Shane and I am a former Phat Boyz DJ which was based out of Chilliwack. I have 10 years experience mostly doing weddings mostly throughout the Fraser Valley. Smokin Beatz DJ Services is based out of Abbotsford but I am a mobile DJ throughout the Fraser Valley. I love getting the crowd going with music. My goal is to make your event memorable and fun. Smokin Beatz has a vast amount of music to choose from. From 50′, 60’s, 70’s, 80’s, 90’s all the way to current music. We also have music videos. At Smokin Beatz we take pride in providing music for the whole crowd to enjoy. The DJ is trained to read the dance floor to keep people dancing all night long.</p>
</div>
<div id="contact">
<h2> Contacts</h2>
<p> Book your DJ today. Feel free to reach out by message provided below or phone (text or call). smokinbeatzdj@gmail.com
(604) 798-5789 </p>
</div>
<iframe width="450" height="300" src="https://videos.files.wordpress.com/uUdFzu9E/20191130_160958-1-1_hd.mp4" frameborder="0" allow="autoplay; encrypted-media"
allowfullscreen id="video"></iframe>
<form action="https://www.freecodecamp.com/email-submit" id="form">
<input type="email" name="email" id="email" required placeholder="Enter email to be contacted" class="email">
<span class="btnRow">
<input type="submit" id="submit" value="Submit" class="Submit">
</body>
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.71 Safari/537.36
Challenge: Build a Product Landing Page
Link to the challenge:
