Is there a way to create a 2 column div with equal width of 50% each, without using floats? Yes, by setting the display property to inline-block. However, a problem arises when attempting to set both columns to exactly 50% - the second div ends up going down to the next line.
#first{
background-color: aqua;
display:inline-block;
width: 50%;
}
#second{
background-color: blueviolet;
display: inline-block;
width: 50%;
}
I even attempted adjusting the box-sizing property, but unfortunately it did not resolve the issue at hand.
Any suggestions on how to overcome this obstacle?