# Processing Foundation logo too wide for mobile

**URL:** <https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838>\
**Category:** Site Feedback\
**Created:** [November 22, 2018, 11:13pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838 "2018-11-22T23:13:47Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jakub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jakub/32/2192_2.png) [@Jakub](https://discourse.processing.org/u/Jakub)\
**Post date:** [November 22, 2018, 11:13pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/1 "2018-11-22T23:13:47Z")

</div>

Did the logo for this site change recently?

My profile icon in the top right corner is now partly out of the screen and it’s hard to see when there is a notification badge on it.

 ![Screenshot_20181123-001010_cropped](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6abb51a4300586e971e10bf03c74877ea5ce6948.png)

---

<div class="post-metadata">

**Author:** ![hamoid](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hamoid/32/58_2.png) [@hamoid](https://discourse.processing.org/u/hamoid)\
**Post date:** [November 23, 2018, 11:02am UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/2 "2018-11-23T11:02:00Z")

</div>

At least in Firefox, the way to fix it is:

From

```auto
    <img id="site-logo"... height="36"

```

remove

```auto
    height="36"

```

Then replace

```css
.d-header #site-logo {
	width: auto;
}

```

with

```css
.d-header #site-logo {
	max-width: 100%;
	max-height: 36px;
}

```

That way it seems to be responsive.

Without this change the navigation menu seems to be gone in small screen sizes (your icon and the “hamburger” menu). See:  
 ![Screenshot_2018-11-23%20Processing%20Foundation](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/8/86be17b5acc27674591c263d11274170767b5e89.png)

---

<div class="post-metadata">

**Author:** ![Jakub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jakub/32/2192_2.png) [@Jakub](https://discourse.processing.org/u/Jakub)\
**Post date:** [November 23, 2018, 3:35pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/3 "2018-11-23T15:35:53Z")

</div>

It worked fine yesterday so I think something had to change since then. Wasn’t the text in the logo split into two lines?

---

<div class="post-metadata">

**Author:** ![hamoid](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hamoid/32/58_2.png) [@hamoid](https://discourse.processing.org/u/hamoid)\
**Post date:** [November 23, 2018, 5:33pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/4 "2018-11-23T17:33:18Z")

</div>

I did not pay attention to that, I only use it in desktop.

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [November 24, 2018, 10:40pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/5 "2018-11-24T22:40:25Z")

</div>

Maybe a browser software update?

I’m also a desktop user, so I’m not sure – but I’m not seeing a problem in Chrome.

One possible solution would be to rename the banner text “Processing Foo”. There: I fixed it… 😉

---

<div class="post-metadata">

**Author:** ![ReDeagle](https://avatars.discourse-cdn.com/v4/letter/r/8edcca/32.png) [@ReDeagle](https://discourse.processing.org/u/ReDeagle)\
**Post date:** [November 24, 2018, 10:42pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/6 "2018-11-24T22:42:27Z")

</div>

Great solution 😂

---

<div class="post-metadata">

**Author:** ![Jakub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jakub/32/2192_2.png) [@Jakub](https://discourse.processing.org/u/Jakub)\
**Post date:** [November 25, 2018, 7:45pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/7 "2018-11-25T19:45:28Z")

</div>

Most of the time I’m using Chrome on Android. There was no update of Chrome recently so I believe something changed in Processing Discourse, because it worked fine on November 22.

Looks like the problem is in Discourse update 2.2.0-beta4. More people are having problems with the logos in the latest version:

> **[Logos just got weird on our site after upgrading today](https://meta.discourse.org/t/logos-just-got-weird-on-our-site-after-upgrading-today/102636)**
>
> Hey everyone, we updated our Discourse today and something is affecting our site logos now. Kinda similar to Mobile logo in header broken and Logo suddenly got small with latest update. Could someone check my CSS? but not quite the same as either of...

  

> **[Mobile logo in header broken](https://meta.discourse.org/t/mobile-logo-in-header-broken/102592)**
>
> Hello! Did something recently change about the logo in the header for mobile? It recently broke on my site. Alternatively, what are the appropriate dimensions to use for a new header? (If it won’t automatically resize for mobile)

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [November 25, 2018, 8:39pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/8 "2018-11-25T20:39:43Z")

</div>

Got it. And I can now confirm seeing the problem on Android Chrome – just not iOS Chrome.

Who is the master admin who updates the site? Casey?

---

<div class="post-metadata">

**Author:** ![Jakub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jakub/32/2192_2.png) [@Jakub](https://discourse.processing.org/u/Jakub)\
**Post date:** [December 1, 2018, 4:33pm UTC](https://discourse.processing.org/t/processing-foundation-logo-too-wide-for-mobile/5838/9 "2018-12-01T16:33:14Z")

</div>

Seems to be resolved 🎉