Decimal Places in CSS

> Ooops, meant to post in CSS - sorry.

What are the rules for decimal places in CSS? I know I can use 1.2em to set a line-height, but what about percentages - can I have 10.5% for a width? Also, how many decimal places will CSS resolve? I am trying to have a variable number of SPANS fill 100% of a variable container. To do this, I am dividing 100% by the number of SPAN elements which, more often than not, results in a number like 2.9777777, and setting it as the width but it is not working out.

Thanks,

Rob.

Although you can use decimal places in CSS like 100.0% in reality it best to keep to real numbers for percentages and only upto one decimal place with standard linear integer values. Your 2.9… probably would be read as 3.

Furthermore you have to remember many elements use padding, margins and borders.

Basically all your numbers will be rounded to the nearest pixel.

You can’t have a fraction of a pixel, but for all other measurements that are in the end converted to pixels, you can use decimal places.

However rounding errors can occur where by rounding up, you use more pixels than 100% (like 33%, 34%, and 33% together, at certain screen sizes, may fill one pixel more than 100%). This can cause problems in floated layouts. The easiest way to fix this is to leave a bit of extra space between elements (like use 33%, 33%, and 33% together, and leave the last 1%).

In some cases, this works quite well:

div {
  width: 33.33%;
  mergin-right: -1px;
}

Not all the time though…

Douglas

margin-right: might work better :wink: