DEV Community

Cover image for Implementing the Android Logo with HTML and CSS

Implementing the Android Logo with HTML and CSS

Nedy Udombat on June 17, 2019

In this article, We will implement the android logo with just HTML and CSS. This may seem like a ton of work but we will go through it step by step...
Collapse
 
nedyudombat profile image
Nedy Udombat

Yes you are right @neilonsoftware , this is for the purpose of a learning exercise. And an SVG would be preferred in a real world application. Here the reader gets to learn about some concepts and what they do like positioning etc. This knowledge they can apply in other aspects of real world problems.

Collapse
 
julborre profile image
Julian.Borrero

Nice! Great tutorial, I'll give it a try in a couple of hours. Thank you!

Collapse
 
nedyudombat profile image
Nedy Udombat

Thank you @julborre , I'll love to see how it goes

Collapse
 
joyceo profile image
joyce obi

Good job @nedy

Collapse
 
nedyudombat profile image
Nedy Udombat

Thank you @joyceo

Collapse
 
bukkyomo profile image
Bukola

An interesting read. Good job @nedy.

Collapse
 
nedyudombat profile image
Nedy Udombat

Thank you @bukkyomo

Collapse
 
wakwe profile image
Olisa Wakwe

Nice. Well done!

Collapse
 
nedyudombat profile image
Nedy Udombat

Thank you @0lisa

 
nedyudombat profile image
Nedy Udombat

Thank you @neilonsoftware

Collapse
 
azza85 profile image
aaron

Great work! I love the hover effects!

Collapse
 
nedyudombat profile image
Nedy Udombat

Thank you @azza85

Collapse
 
stamgolesh profile image
stamgolesh • Edited

hi,
just finished it. was great. thank you.
2 things:
1 - the arms are 58px away (50 + 8) - i saw 50 and it drove me crazy...
2 - the .android is centered - as it should be, but the inside is not. if you inspect, you'll see it's all aligned left. how can that be fixed?
also - there's a default margin by the browser and it ads a scroll to the side.
again - was great. thank you.

Collapse
 
nedyudombat profile image
Nedy Udombat

Thanks @kiing_edy I'll correct that right away