Is there a way to incorporate footer-type text with copyright disclaimer into a masthead-only website? I keep trying to add a footer, but it ends up getting stacked outside the masthead, causing the screen to become scrollable. My goal is to include the copyright and link to privacy terms within the masthead (reference images provided below).
I have documented my progress through attached images.
The objective is to display the copyright line differently based on the screen size:
- For desktop: positioned at the bottom left aligned under the newsletter form (refer to the attached images)
- For mobile: centered beneath the social logos (see images for reference)
Status of my current progress: The following screenshots demonstrate what has been implemented so far. Any advice or guidance would be greatly appreciated!
Here are the current views on desktop and mobile:
This is the desired implementation:
- For desktop:desired desktop view
- For mobile: desired mobile view - ignore the blue background behind the copyright
HTML:
<html lang="en">
<!-- HTML code here -->
</html>CSS:
html {
height: 100%
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: Merriweather;
font-weight: 700
}
/* CSS code continues */
.footer-text {
padding: 10px;
color: #fff
}