HTML/CSS Footer

+2 Charlie Coplestone · December 19, 2014
Hello guys,

I've been following Bucky's tutorials on the CSS footer he made. I've got the basic design down and I can set the buttons up just fine too. However, whenever I add a headerLink or a listLink, the text from either moves onto the button and pushes the text on the button up and also makes the button wider like so:

http://gyazo.com/871c0e5cf6997c23406d684afd1780da

Button one is what happens when ever I add a headerLink/listLink and the other buttons are just normal buttons that don't specifically do anything but they sit okay on the footer.

Here is an example of what is happening along with my source code:

http://codepen.io/anon/pen/MYeqaV

Any help would be greatly appreciated.

Regards,

Charlie

Post a Reply

Replies

Oldest  Newest  Rating
0 Charlie Coplestone · December 20, 2014
I've managed to fix this to the point of no longer seeing the headerLink in the button by moving with </div> tags inside the <li> tag. The only issue that still remains is that when I add a column, the button gets bigger. What I find weird is that the button's box has increased in size almost as if to accommodate for the column size. The button gets increasingly bigger if I add a two or three column layout.
  • 1

HTML / CSS / Web Design

107,044 followers
About

Discuss, share, ask, learn and teach HTML5 and CSS3.

Links
Moderators