#### HTML and CSS Project: "Do Something That Matters" Trailer
Here's a small HTML code with CSS to create a simple, interactive webpage for the "Do Something That Matters" trailer project.
html
Do Something That Matters Trailer
Topics
Topic 1
Topic 2
Topic 3
Welcome to "Do Something That Matters" Trailer
Select a topic from the sidebar to view more information.
#### CSS (style.css)
css
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.container {
display: flex;
}
.sidebar {
background-color: #f4f4f4;
padding: 20px;
min-width: 200px;
}
.sidebar h3 {
margin-bottom: 10px;
}
.sidebar ul {
list-style: none;
padding: 0;
}
.sidebar li {
cursor: pointer;
margin-bottom: 5px;
}
.content {
padding: 20px;
}
This HTML and CSS code creates a simple webpage for the "Do Something That Matters" trailer project. The page consists of a sidebar with topics and a content area that dynamically loads information based on the selected topic. This interactive design allows users to click on a topic and view relevant content without the need for a full-fledged JavaScript implementation.
Feel free to customize the topics and content based on the specifics of the "Do Something That Matters" trailer project!