Coffee cards behaviour in coffee shop project

#1

while styling the coffee cards, thier width is 22% , but they are div’s , how can act as inline elements,like all the 4 divs displayed in the same line, if we delete the float:left property,they are behaving as div’s. What difference did the float:left property do?

#2

@swathimelapu8 Please share the code so I can better understand your query.

#3

Sir,the code is same as the instuctor guided me, but my query is:
If we remove(or comment out) float:left property in card class , all the four div’s(coffee images) displaying in 4 different levels.Why is that so?
.card{
width: 22%;
padding: 1.5%;
height: 250px;
text-align: center;
}

#4

@swathimelapu8 please share the link to the lecture so I can better understand the exact situation.

#5
#6

@swathimelapu8 I’ll look into this and get back to you by tomorrow.

#7

@swathimelapu8 can you please share the HTML ,CSS and JavaScript files you wrote so I can have a look at the entire code you wrote?
You may upload these files on Google Drive and share a public link.

#8

https://drive.google.com/drive/folders/1cNOVXUBXG_TJb5E_D5dwHGzq9ngmVHHk?usp=sharing