+ 1

Imma Dummy :v

I've just started learning and experimenting with HTML and CSS (on way to learn JavaScript!! yay! ヽ(*≧ω≦)ノ). I was trying to place two float divs at the side of each other, taking each 50% of the page. In the css I wrote: float: right/left; border: thin solid black; width: 50%; I just spent a hole 90mins trying to see why the dibs never aligned each other, not realizing that the thin border ads another 1px to the dib-box. I erased the border value. And it was fixed.... I am a dummy 😂😂

21st May 2017, 3:09 AM
Alastair Rails
Alastair Rails - avatar
4 Antworten
+ 14
hehe, don't worry, keep experimenting 👍 good thing you were able to solve it 😊 This happens because the default value of the width and height properties of browsers is set to content-box. So another way to solve this issue is by using the CSS box-sizing property. With it you can tell the browser that the sizing properties (width and height) should include the border-box. Like this: div { border: 1px solid; box-sizing: border-box; } With that code you're specifying that all <div> elements should have border (and also padding) included in the element's total width and height 😊
7th Jun 2017, 9:00 AM
Pao
Pao - avatar
+ 10
No,Test everything is like "self-teaching" You are not "dummy"
21st May 2017, 3:19 AM
Yanothai Chaitawat
Yanothai Chaitawat - avatar
+ 8
You is smart. Figured it out all by yourself
21st May 2017, 3:42 AM
jay
jay - avatar
+ 1
:v!
24th Feb 2018, 3:46 AM
Marco Angel²
Marco  Angel² - avatar