Strange problem with footer

Asked

Viewed 102 times

0

I’m developing this site:

http://conscienciaestelar.filosofiaesoterica.com.br

And I’m encountering problems with footer positioning. I’m using twitter bootstrap(just the grid) and SASS as tools.

If you open the site, you will see that the footer is positioned above the article container, and its elements are in the correct location (below it). I even put the edges of the footer black so you can see the problem.

If you inspect the header, footer and Section elements, you can see that the boundaries of the inspector’s lines only go up to the beginning of the article container. It is very strange, after all, I nested the html perfectly within the mentioned tags. What may be happening?

html css sass

1 answer

1

Add a <div style="clear: both;"></div> at the end of <div class="row content-index">.

This will "clear" the articles' Ivs floats.

If you want to know more about this, here is an article (in English): http://css-tricks.com/all-about-floats.

Another thing, unrelated to the question: gives a revised source of the site; in some places it is barely readable.

  • But man, would you like to explain to me why the inconsistency in my layout? I always used the bootstrap grid and this had never happened before. Your solution worked... But I can only style the footer if I set the position to Absolute (which was never needed with bootstrap). I’m finding it very strange.

  • clear:Both serves to 'delimit' floating elements, thus creating a basis for your footer to position itself. When we use the float on an element, the next elements cannot understand where the float starts or ends, unless they also have a float. I don’t know if you understand. hehe

Browser other questions tagged html css sass

You are not signed in. Login or sign up in order to post.