[ZendTo] Possible CSS problem with logo in 5.17

John Thurston john.thurston at alaska.gov
Thu Mar 28 20:49:13 GMT 2019


On 3/28/2019 2:09 AM, Mark Allen wrote:
> John,
>       I had the same issue recently, we had to change the background to conform to the Corporate colours and to get the logo to fit correctly. here’s what we did:
...

> **THIS IS THE BIT YOU NEED TO CHANGE THE LOGO SIZE**
> To ensure the ICR logo fits on
> the page:
> Change logo line 683 to max width
> 290: max-width: 290px;

I don't think this is for the problem I'm seeing. I'm not trying to 
change the logo, and there is no horizontal clipping or scrolling 
happening, so the width is ok. I think the problem is the 'font-size' is 
set larger than 3.46em in #logo. If I set that to 3.4em the vertical 
scroll goes away. Maybe there is something wrong with font scaling or 
substitution on my browser.

But with some more digging, I think this may go back to the #logo style 
definitions.

#logo defines "overflow-y: visible;"

and then

#logoxclip defines  "overflow-x: hidden;"

There is no #logoyclip style.

So it sure looks like that silly vertical scroll bar is by design. Why 
is there an 'xclip' style? Why doesn't #logo just contain "overflow: 
hidden;" and have done with it?

I think the simplest way to solve my problem (so all the edits are to a 
single file) will be to modify swish2.css to
   Change "overflow-y: hidden;" in #logo
and to
   Add "overflow-y: inherit;" to #logoxclip

I've just managed to look at my test site with google chrome browser. It 
has the same problem, so I don't think this is just a case of my firefox 
not being able to scale a font.

I don't think this is a problem at the reference installation at 
Southampton (https://dropoff.soton.ac.uk/) because they're using an 
image for their logo rather than text.

--
    Do things because you should, not just because you can.

John Thurston    907-465-8591
John.Thurston at alaska.gov
Department of Administration
State of Alaska

On 3/27/2019 3:16 PM, John Thurston via ZendTo wrote:
> I'm working on an update from 5.10 to 5.17, and I'm not a CSS pro, so 
> I'm looking for for help or confirmation of problem.
> 
> After the update, the logo text in the upper right corer "ZendTo" gets a 
> vertical scroll bar and thumb. There is a very tiny amount of movement 
> in it. When I use Firefox element inspector, and un-tick the 'logoxclip 
> overflow-x:hidden' from swish2.css, the scroll bar goes away.
> 
> I know little of css, so I went to w3schools to see what I can learn.
> https://urldefense.proofpoint.com/v2/url?u=https-3A__www.w3schools.com_cssref_css3-5Fpr-5Foverflow-2Dx.asp&d=DwICAg&c=teXCf5DW4bHgLDM-H5_GmQ&r=LXZcjhZDA2Cbv2Jma4IUFbBvxdnXAg5iEX34eEaPIoo&m=vXs9BxoD0Qm9e7vzPU5Dc2g3-YfjGIOgAAyqGBTe2zk&s=71dNdTQFQ1LmxueZ1flK7bUI7mu2aD8eKYAyZ_hCOjs&e= 
> 
> 
> I can make it display correctly by replacing 'overflow-x' with 
> 'overflow', or by also defining a similar value for 'overflow-y'. Does 
> anyone else see this problem? Have I messed up something else which is 
> making my logo text render a tiny bit larger than everyone elses?



More information about the ZendTo mailing list