05-surf-and-paddle-David-Cawton

[davidcawton]

• [x] Create a new Issue with these tasks!
• [x] Use the git cli to initialize a new project
• [x] Checkpoint: Created and committed index.html and app.css boilerplate
• [x] Use the hub cli to create a repository called 05-surf-and-paddle
• [x] Use the git cli to create a branch called develop
• [x] In Github, open a PR from develop into master
• [x] Use CDN to link to Font Awesome
• [x] Create the markup to represent the pictured site
  • [x] Checkpoint: Create markup to represent one item in the timeline
  • [x] Markup: Navbar
  • [x] Markup: Header
  • [x] Markup: Left Column
  • [x] Markup: Sidebar
  • [x] Markup: "Most Popular Posts" with Images
  • [x] Markup: Footer
  • [x] Checkpoint: Duplicate the first item to create multiple items to style
  • [x] Complete: Push index.html
• [x] Add styles for page
  • [x] Checkpoint: Style the Layout of the site
  • [x] Style: Layout and Backgrounds Navbar
  • [x] Style: Layout and Backgrounds Header
  • [x] Style: Layout and Backgrounds Left Column
  • [x] Style: Layout and Backgrounds Sidebar
  • [x] Style: Layout and Backgrounds "Most Popular Posts" with Images
  • [x] Style: Layout and Backgrounds Sticky Footer
  • [x] Checkpoint: Style the details for the site
  • [x] Style: Details Navbar
  • [x] Style: Details Header
  • [x] Style: Details Left Column
  • [x] Style: Details Sidebar
  • [x] Style: Details "Most Popular Posts" with Images
  • [x] Style: Details Footer

[davidcawton]

https://github.com/davidcawton/05-surf-and-paddle/pull/1

[rtablada]

@davidcawton check the margin on the bottom that is giving extra white space instead of letting the page fill the browser.

Then give your .maincontent some max-width so that the text content doesn't get too big on wide screens.

[rtablada]

@davidcawton the header and footer should be full screen width.

Looks like you have margin on both body and html that are stopping that from happening.

You can limit the max-width for .blog to get similar results for the middle section but let the header and footer stay free.

[rtablada]

@davidcawton same here

[davidcawton]

@rtablada Those issues should now be fixed.