Box sizing suddenly stopped working

Question

I´m using the box-sizing: border-box; element to make my boxes on my website behave the same on multiply browsers. It has worked perfectly great since I started create the website but today the box-sizing element suddenly stopped working. I´ve no clue on what´s can be the problem. Help would be much appreciated!

Here´s a link to my website: http://amazive.com As you can see, all the boxes have put the padding "outside" instead of "inside" the boxes.

This is my reset code:

* {
    margin:0; 
    padding:0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

Thanks, Fredrik

Including the link to the website will not get you a good answer. Try and replicate the problem with the minimum code possible and post that here. — stackErr, Jan 29 '14 at 18:44
stackErr I don´t know which code which would be in interest for this problem except for the code presented. — Akerman, Jan 29 '14 at 18:50
@user3250205 Is the below answer what you were looking for? If not please let me know and I will modify. — camdixon, Jan 29 '14 at 19:09

score 1 · Accepted Answer · answered Jan 29 '14 at 19:14

Loading your site I see the following error in the console:

Selector expected.  Ruleset ignored due to bad selector. main.css:1

If you look at the first line of your main.css file you'll see it is:

</*****************************************************

Remove the leading angle bracket so it looks like:

/*****************************************************

score 0 · Answer 2 · edited May 23 '17 at 11:49

0

From what I gather you want box-sizing; border-box; to be on all of your elements? To do it use this code

/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
 }

Here is a codepen sample: http://codepen.io/camdixon/pen/DgrGC

I got the answer from here: http://www.paulirish.com/2012/box-sizing-border-box-ftw/

A more detailed answer and IE tricks found here: * { Box-sizing: border-box; } : To border-box or not to border-box all elements?

edited May 23 '17 at 11:49

Community

1
1

answered Jan 29 '14 at 18:58

camdixon

852
2
18
33

Found that too, but this isn´t working either. Thanks annyway! – Akerman Jan 29 '14 at 19:13

Box sizing suddenly stopped working

2 Answers2