Logo Size Help Wanted

[Focker]

I removed the logo except for the main page by using this code - #logo {display: none} in Dashboard>Settings>Theme - "Custom CSS code" and did the following to place the logo only on the main page.

Path - Dashboard>Settings>Homepage - "Title" box
Here's my mod:
<img src="image address/file" width="80%">

It looks perfect on mobile, but it's too big on a computer. Is there a simple way to distinguish between a mobile and a computer through the Dashboard>Settings>Homepage - "Title" box path?

Thank you.

Edit: Fixed spelling error.

 

[Rodolfo]

CSS

.device-nonmobile <selector> { your non mobile device rules }
.device-mobile <selector> { your mobile device rules }

 

[Focker]

CSS

.device-nonmobile <selector> { your non mobile device rules }
.device-mobile <selector> { your mobile device rules }

Thanks, but as usual...You're smarter than me.

 

[tomsit]

Sloppy but better

<img src="image address/file" width="auto">

 

[Focker]

Sloppy but better

<img src="image address/file" width="auto">

Thanks for the idea, but now it's even bigger on the computer and huge on my mobile.

 

[tomsit]

Sent you a PM

 

[Focker]

Sent you a PM

Thanks...Working with your suggestion right now.

 

[Focker]

Sent you a PM

You nailed it...THANKS!

 

[matou19]

CSS

.device-nonmobile <selector> { your non mobile device rules }
.device-mobile <selector> { your mobile device rules }

Hi, It doesn't work

#index .top-bar-logo img{margin:auto;width:100%;margin-top:40px;height: 143px; width:341px;}
#index .device-mobile .top-bar-logo img{margin:auto;width:#%;margin-top:#px;height: #px; width:#px;}

 

[Rodolfo]

Of course it won't, your code is wrong. The device class is added to the root html and you call it as a child node.