1
0 Comments

Promotional Header Banner Using Container

Intro

Adapting https://smalltowndreamer.co.uk to have a clickable promo banner at top like CeruleanSounds.com.

Preview (will transfer Wednesday):
https://smalltowndreamerdraft.carrd.co
user: guest | pw: test

Changes Made

Page

Set Max Width to 100.
Original:
pic
Remove vertical padding & margins.
Margins also affects the other three sides:

Horiztonals

In response you have to: increase horizontal padding. Though, above 2 it doesn't seem to make any difference.

Bottom

Add a "Spacer": i.e. a Blank Container with e.g. max (12) height

Container

Also set Width to Max and Remove Vertical Padding & Margins.
Remove Horizontal Padding too.

Questions

  1. When can you recreate the effects of margins with padding?
  2. Is it possible to make the entire Container clickable? e.g. with CSS Property?

Feel free to throw me any other feedback you have on this site (it's for my debut album so really important for me). It's based around AirTable embeds, but they become very narrow on mobile.

Trending on Indie Hackers
How do you decide what idea to work on? 35 comments Design & UI/UX takes me so long- am I doing everything wrong? 30 comments Looking for feedback on a note-taking tool focused on your personal interests. 7 comments My new self destructing notes app is on product hunt today. Would love some support. 6 comments Here's how I'm going to try to scale my tech newsletter from 0 subscribers to 10 000 subscribers 5 comments Looking for an Product & SEO/Content Marketing Partner 1 comment