Mobile Header Issues

#mobile #header

- 9 years, 11 months ago joe_giacomet
  Participant
  
  Expired
  
  Hi,
  
  Thanks for fixing my last issue.
  
  I’m having problems with the headers on mobile. The title of the header is being cut off as it’s too long.
  
  For example on this page – ‘About Pabo Tree Services’ it just says ‘About Pabo’
  
  https://www.commercial-tree-surgeons.co.uk/about-commercial-tree-contractors/
  
  And on this page ‘Forestry & Heathland’ it just says ‘Forestry’
  
  https://www.commercial-tree-surgeons.co.uk/forestry-heathland/
  
  Secondly the header images are greyed out on mobile
  https://www.commercial-tree-surgeons.co.uk/about-commercial-tree-contractors/
  
  Thirdly on the home page the ‘text with separator’ box that reads
  
  North Wales, Cheshire, Manchester etc goes off the right hand side of the page.
  I’ve set everything to centre but it still won’t drop the text down to a new line.
  https://www.commercial-tree-surgeons.co.uk
  
  Thanks in advance,
  
  Joe
- 9 years, 11 months ago Mirela
  Participant
  Hello,
  
  1-Please add this code into your custom css box:
  
  @media (max-width: 480px){ .header_page.centered h1 { line-height: 40px; font-size: 33px; margin-top: 6px; }}
  
  2-Please send us your wp credentials in a private reply, so we can give it a closer look.
  3-What do you mean for this? There is not too much text to get to a new line. The text is indeed centered.
  
  Best regards!
- 9 years, 10 months ago joe_giacomet
  Participant
  
  Expired
  
  Hi, sorry for the slow reply.
  
  I didn’t receive a notification for reply.
  
  1. This is definitely an improvement. It’s not working better on a lot of pages.
  It’s still not showing up the third line of text and some pages such this:
  https://www.commercial-tree-surgeons.co.uk/forestry-conservation/
  But it’s not the end of the world.
  
  2. I’ll PM you my wp login.
  
  3. It’s centred on desktop, but on mobile and tablet it bleeds off the right hand side of the page.
  ‘Pabo Tree Services Work throughout’ is fine.
  It’s the line below that is the problem.
  Do you need me to send you a screenshot?
  
  Thanks,
  Joe
- 9 years, 10 months ago joe_giacomet
  Participant
  
  Expired
  
  This reply has been marked as private.
- 9 years, 10 months ago Ruco
  Keymaster
  Hello,
  
  1. Please try this:
  
  @media (max-width: 480px){ .header_page.centered h1 { line-height: 40px !important; font-size: 20px !important; margin-top: 6px;} }
  
  2. Edit the page , go to page header
  https://www.clipular.com/c/5820780427345920.png?k=rw7Llkq_UU0xHFEtqlpJ0Frlc5c
  
  Remove the color, click clear.
  
  3. I checked it on ipad it look OK. Can you show mw a screen shot?
  
  Best regards!
  
  This reply was modified 9 years, 10 months ago by Ruco.

Viewing 4 reply threads

You must be logged in to reply to this topic.

Community Forums

Site Links

Useful Articles

Login