1. Top red line is 'with: 100%'
2. Blue line is 'with: 640px'
3. Green line is 'with: 50%' 4. First image is a div 'with: 100%' and image 'with: 320px'
5. Second image i a div 'with: 50%' and image 'with: 50%'
6. Third image is a div 'with: 640px' and image 'with: 320px'
7. Fourth image is a div 'with: 100%' and image 'with: 50%'

Why is the blue line actually 418px wide and 2 of the images 209px wide?
I would understand something if the blue line was 320 and the images 160 due to some retina issue - but 418 and 209???