[tsimarketing]

Is there a code that can make the left padding smaller? I thought I had a css code for that already but I don’t think I do or I can’t find it.

[tsimarketing]

That worked for allowing me to change the size. But some of the words are pushed to the right for some reason. I have attached a screenshot showing you what I’m talking about. If you look at Gastroenterology or Otolaryngology, those names are pushed to the right a little, they’re not centered in the box.

Also how can I get the icon and name centered vertically in the box?

Attachments:

You must be logged in to view attached files.

[tsimarketing]

Actually nevermind, it works now because I added it to the top of my custom css. So now I would like to know how to make the menu icon centered vertically. I have attached a screenshot

Also is there a way to change the size of the logo on phone view, not tablet view(it looks great on tablet or ipad view)? Because as you can see from the screenshot, the logo is kind of big and seems to be adding some padding between itself and the header.

Attachments:

You must be logged in to view attached files.

[tsimarketing]

Ahh Finally! Moving it up to the top worked, weird. Do you know why having it at the bottom wasn’t working?

[tsimarketing]

For some reason it’s still not working. Would you like to login to see whats happening?

[tsimarketing]

Yes at the very bottom. Are you looking at tsihealthcare.com/test? We created a new test website so we can test these mobile things on it before applying it to the live website.

[tsimarketing]

Yeah I have already tried making the max width 768 and it still shows up on both mobile and tablet view.

[tsimarketing]

I put this code in but still doesn’t seem to take away the thumbnail photo. I have attached a screenshot from my iPad to show you what it looks like. And the photo still appears on the phone view too.

Attachments:

You must be logged in to view attached files.

[tsimarketing]

When I look back at all my custom css I don’t see that @media css code. I only see the code below for the promo bar. And that makes the promo bar the right colors on my desktop, it’s just not doing the same thing on mobile view. On mobile view the hover color is correct, but the base color is gray and that is not what I want.

#base-promo.footer-promo-arrow:hover, #base-promo.footer-promo-text:hover, .sf-promo-bar.promo-arrow:hover, .sf-promo-bar.promo-text:hover {
background-color: #6caae4!important;
}
#base-promo {
background-color: #0A548B!important;
}
#base-promo > p, #base-promo.footer-promo-text > a, #base-promo.footer-promo-arrow > a {color: #FFF!important;}

[tsimarketing]

This code isn’t working. You can still see the blog photo thumbnails on the homepage of mobile view.

[tsimarketing]

I tried this code but it did not work. The mobile menu icon and logo did not move on the phone view and the mobile menu icon is still not centered vertically on the tablet view. I even tried changing the padding numbers and it did nothing.

[tsimarketing]

Im having a similar problem with the thumbnail photos showing up on the mobile view on our homepage. Is there a way to add the @media tag to the front of the code above so that it takes away the photo thumbnails on mobile version too?

You can check out the mobile home page at tsihealthcare.com/test

[tsimarketing]

tsihealthcare.com/test

But that promo bar isn’t just on one page, it is on several pages throughout the site.

[tsimarketing]

I have a follow up question to this now that we are putting together our mobile site. The promo bar is exactly how we want it to look on our desktop version of the website, but it is gray on our mobile version. Is there a way to change the color of the mobile version promo bar to be the dark blue background with white text?

[tsimarketing]

Because we all liked the look of the weight and size. But is there nothing I can do or add to control the spacing between bulleted item?