+ 1

CSS and HTML

Hello everyone, I’m trying to make HTML coded resume in which I was trying to have boxs so I have created a div in which there is two different div but the they are overlapping I want to have them on left and right both are at left 0px; I have created I’d for them so will directly mention code with id below Code I have been using for css is #main { Height 650px; Width 500px; Background colour red; Border 2px solid black;} #box1 {Height 100px; Width 200px; Background colour blue;} #box2{Height 200px; Width 300px; Background colour yellow ;} I have not used inline property and display flex is also not working Anyone can help on this ?

13th Apr 2020, 12:33 PM
Avinash
Avinash - avatar
1 Odpowiedź
0
First, you need colon (":") as separator between properties names and values. Second, you need a dash ("-") as joiner between words composing a property name, and third the correct spell of background colour property name is "background-color" (with the dash and without the "u")... And finally, your code will be much readable and pleasant if you format it a minimal (indentation, common conventions: css is case insensitive, but mostly everybody write property names all lowercase ;) #main { height: 650px; wodth: 500px; background-color: red; border: 2px solid black; } #box1 { height: 100px; width: 200px; background-color: blue; } #box2 { height: 200px; width: 300px; background-color: yellow; } /* debug styles */ #main { outline: 5px dashed darkred; } #box1 { outline: 5px dashed deepskyblue; } #box2 { outline: 5px dashed gold; } (I've added some "debug styles" to improve your comprehension of what you're doing: outline, unlike border, doesnt change elements)
14th Apr 2020, 1:39 AM
visph
visph - avatar