Member Avatar for mattyd

Hello.

Having some trouble figuring out a CSS footer issue.

The footer should fill the page fully, not extend a horizontal scrollbar and importantly, not have a 3-5 pixel left gap.

I've tried all I know to fix this.

Here is the CSS for this:

footer
{
float: left;
min-width:100%;
padding:40px;
background-color:#c81818;   
margin:0px;
font-family:"Trebuchet MS",Helvetica, sans-serif;
color:#ffffff;
font-size:16px;
}

Please view the link below to see it live.

*Note: This is only a landing page for SEO-bots until the main site is built - It's not fancy or pretty

Click Here

Thank you in advance!
Matthew

  • 2 Contributors
  • 2 Replies
  • 170 Views
  • 1 Hour Discussion Span
  • Latest Post Latest Post by mattyd
Member Avatar for JorgeM

Hi Matthew,

its a good idea to apply a "CSS Reset" so that you user agent's default styles dont apply. This will give you a more consistent display across different browsers....

So, if you apply a margin:0 to the body element, it will get rid of the left space.

Also, the extention on the right is a result of adding 40px of padding to the footer element.

Edited by JorgeM
commented: Thank you, Good Sir! Always of great help. +7
Member Avatar for mattyd

All fixed.

Thank you, JorgeM.

Matthew

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.