How to split columns?

Question

css

The question is all based on the same book Ethan Marcott - Responsive Web Design. In the screenshot screenshot.ru/71823bd91343cddab435c79c27739e6e Ethan talks about columns and smaller modules in the columns themselves (you can read the text on the screenshot). I don't quite understand how he divided the columns. Why is one 566px and the second 331px where I marked with an arrow it is not clear how the con separated these columns? I also noticed that it does not have margins between columns, although it seems to be visually similar to margins, but in fact it has 2 columns back to back and indented it with paddings.

Answer 1

let's say both columns are float: left, width as a percentage (from here 566 and 331 - the percentage is calculated from the base width) + inner padding.