Position and look of Button Label on slideshow

Solved
Diamond0711
Excursionist
43 0 5

Hi guys! 

How can I make this Button Label smaller and remove the annoying white background on mobile devices? 

DF8C86DD-CD81-4FFE-9627-A2ED2DAEE869.jpeg



My store: domercosmetics.com

password: domer

thanks! 

0 Likes
ahsaniub123
Shopify Partner
54 9 6

Hi @Diamond0711 

Please add this code in very bottom of theme.css file

@media only screen and (max-width: 749px) {
#shopify-section-161142297248858bad .slideshow__text-wrap--mobile {
    display: block;
    position: relative;
    top: -3rem;
    background-color: transparent;
}
}
Did my answer work for you? Please drop a Like and Mark it as Accepted.
Want to develop/design/customize your theme Hire me.
Feel free to contact me at Email: ahsan.iub123@gmail.com | Skype: ahsaniub123 | Whatsapp: +92 3012 104 116.
Shopify Expert | Shopify Developer | Liquid Developer
0 Likes
WinkyApps
Explorer
54 13 13

This is an accepted solution.

Hi Diamond0711,

To remove the white background on mobile devices, login into your Shopify admin dashboard and navigate to Online Store > Themes > Actions > Edit Code

Search for the file theme.css and open it

In this file search for this below lines of code 

.slideshow__text-wrap--mobile {
  display: none; }
  @_media only screen and (max-width: 749px) {
    .slideshow__text-wrap--mobile {
      display: block;
      position: relative;
      top: -1.1rem;
      background-color: var(--color-bg);
      width: 85%;
      margin: 0 0 -1.1rem 7.5%;
      z-index: 8; } }

 

Replace it with the below

.slideshow__text-wrap--mobile {
  display: none; }
  @_media only screen and (max-width: 749px) {
    .slideshow__text-wrap--mobile {
      display: block;
      position: relative;
      top: -1.1rem;
      width: 85%;
      margin: 0 0 -1.1rem 7.5%;
      z-index: 8; } }

All we did here is that we removed the background-color entry to prevent the default white background. 

 

After making this change, save the theme.css file and check the entire store to see if everything is appearing clearly as needed.

Hope this helps.

Did my answer work for you? Please drop a Like and Mark it as Accepted.
If you need further help or want to get something custom built for your Shopify store, then feel free to mail our team on winkyapps18@gmail.com
Happy to help.
0 Likes
Jbari
New Member
1 0 0

i have the same problem and none of the codes has worked for me any help ?

0 Likes