Different total widths when using is-1 - is-12 classes

[galacticjoel]

This is about Bulma | the Docs.

Overview of the problem

This is about the Bulma CSS framework

I am not quite sure if this is an intended feature or a bug.
I'm using Bulma version [1.0.1]
My browser is: Brave

I am sure this issue is not a duplicate? No.

Description

Steps to Reproduce

My code:

	<div class="container  my-6">
		<div class="columns">
			<div class="column is-2">is-2</div>
			<div class="column is-4">is-4</div>
			<div class="column is-6">is-6</div>
		</div>
	</div>
	
	<div class="container my-6">
		<div class="columns">
		    <div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
			<div class="column is-3">is-3</div>
			<div class="column is-5">is-5</div>
			 
		</div>
	</div>
	
	
	<div class="container my-6">
		<div class="columns">
			<div class="column is-3">is-3</div>
			<div class="column is-3">is-3</div>
			<div class="column is-6">is-6</div>
			 
		</div>
	</div>
	
	
	<div class="container my-6">
		<div class="columns">
			<div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
			<div class="column is-2">is-2</div>
		</div>
	</div>
	
	
	<div class="container my-6">
		<div class="columns is-desktop">
			<div class="column is-primary">First column</div>
			<div class="column">Second column</div>
			<div class="column">Third column</div>
			<div class="column">Fourth column</div>
		</div>
		
	</div>

	
	<div class="container my-6">
		<div class="columns">
			<div class="column is-four-fifths">is-four-fifths</div>
			<div class="column">Auto</div>
			<div class="column">Auto</div>
		</div>
		
	</div>
	
	
	
	<div class="container my-6">
		<div class="columns">
			<div class="column is-half">is-half</div>
			<div class="column is-one-quarter">is-one-quarter</div>
			<div class="column is-one-quarter">is-one-quarter</div>
		</div>
	</div>
	
	
	
	<div class="container my-6">
		<div class="columns is-mobile">
			<div
			class="column
			is-full-mobile
			is-two-thirds-tablet
			is-half-desktop
			is-one-third-widescreen
			is-one-quarter-fullhd
			">
				<code>is-full-mobile</code><br />
				<code>is-two-thirds-tablet</code><br />
				<code>is-half-desktop</code><br />
				<code>is-one-third-widescreen</code><br />
				<code>is-one-quarter-fullhd</code>
			</div>
			<div class="column">2</div>
			<div class="column">3</div>
			<div class="column">4</div>
			<div class="column">5</div>
		</div>
	</div>
	
	
	<div class="container my-6">
		<div class="columns">
			<div
			class="
			column
			is-12-mobile
			is-8-tablet
			is-6-desktop
			is-3-widescreen
			is-1-fullhd
			">
				<code>is-12-mobile</code><br />
				<code>is-8-tablet</code><br />
				<code>is-6-desktop</code><br />
				<code>is-3-widescreen</code><br />
				<code>is-1-fullhd</code>
			</div>
			<div class="column">2</div>
			<div class="column">3</div>
			<div class="column">4</div>
			<div class="column">5</div>
		</div>
	</div>

Actual behavior

When I use is-three-quarters, is-two-thirds, is-half, is-one-third, is-one-quarter classes, the total width of the container is the same.
But when I use is-1, is-2, is-3, is-4, is-5... the total width of the container is different even though the sum is 12.
For example:
is-2, is-4, is-6 or is-2 x 6 or is-3 x 4.

I checked in DevTool, and for example column with is-2 class has different width in two containers (197.89 px in one container and 189.99 px in another). is-3 has 288 px and is-6 has 582 px (or 605.67 px in another container). For example, widths of is-3 and is-6 or is-2 and is-4 are not proportional.

Expected behavior