Stats preview card component | Mobile first using HTML, BOOTSTRAP, CSS
Design comparison
Solution retrospective
I need help with how to make design more smoothly responsive, and also I need help with measurement I guess, and spaces
Community feedback
- @MainaShemGPosted over 3 years ago
how did you manage to pick the background color? also the descriptions with companies, templates and queries how didi you arrange them in a horizontal way?tries (display;inline-block ;) but it's not working
0@Rezzak48Posted over 3 years ago@shemaya-dot-hub Hey! : ==> For the background color, do you mean the background color of the image or general background or for the card? ==> to display items inside a container in horizontal way, use : (display: flex) and then you can put space between them manually or use justify-content, check this example :
//HTML : (<body> <div class="cont"> <p>AAA</p> <p>AAA</p> <p>AAA</p> </div>
</body>)//CSS :( .cont { display: flex; justify-content: space-between;})
0@MainaShemGPosted over 3 years ago@errazakallah31 this is how i had initially written my code //HTML
<ul> <li>10k+ <br><samp>companies</samp></li> <li>314 <br><samp>templates</samp></li>sss <li>12m+<br><samp>queries</samp></li> </ul> //CSS ul{ color: white; display: inline-block; } I mean the background color for the image. Your code has solved my problem...been stuck for like an hour Thank You0@Rezzak48Posted over 3 years ago@shemaya-dot-hub yes, then call that class in css and give it display : flex; instead of inline block
0@Rezzak48Posted over 3 years ago@shemaya-dot-hub I am glad that it works for you! Can you make my reply upvoted or mark it as helpful! so others can reach it quickly! thank you...
If you need any other help let me know
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord