Question: Homework 1 Nav{ border: 1px solid white; height: 40px; display: flex; align-items: center; justify-content: end; } button{ padding: 0; border: none; background: none; /* background-color:
Nav{
border: 1px solid white;
height: 40px;
display: flex;
align-items: center;
justify-content: end;
}
button{
padding: 0;
border: none;
background: none;
/* background-color: rgb(216, 231, 229); */
}
.container{
display: flex;
height: 39vh;
}
.sidebar{
width: 40%;
height: 100%;
background-color: black;
border: 1px solid white;
/* padding: 20px; */
}
.body{
width: 100%;
border: 1px solid white;
}
Footer{
display: flex;
justify-content: space-between;
border: 1px solid white;
align-items: center;
height: 30px;
}
#textChange {
color: white;
}
Info: test text 123
test text 456
test text 789
const updateBody = () => {
document.getElementById("textChange").innerHTML = "
You clicked the link to change the text
";}
Need to add these to this code:
-all sections: navigation, header, sidebar, body, footer
-navigation has 2 links
-link one changes text in body
-link two shows alert
-header has image in it
-sidebar has text and a colored backgrond
-body is next to sidebar
-footer is underneath sidebar and page
-Site is responsive to smaller browser width
-Site is using the JQuery Library
-Site is using the Foundation Framework
-Your name is at the bottom of the screen
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
