Recent
Categories
View Replies (5)

Evolution header height and page width on iPhone

0
Votes
Undo
  1. youreinlucknow
    youreinlucknow
  3. Commercial Templates
  4. Monday, 04 March 2013
  5.  Subscribe via email
2 issues:

1. When I view my site (with Evolution template) on an iPhone the header is quite tall. I can adjust the header height and it works/looks fine on a desktop but doesn't change on an iPhone.

How can I make the header adjustment carry over (respond) to iPhone? It's taking up a lot of real estate.


2. My site also goes off the right side of the iPhone screen. It does appear fine on Blackberry devices and on a desktop.

How do I adjust the width or some other setting so that it "responds" to the iPhone and fits that screen width - as well as the other platforms?

The site is: www.MobileBettingCanada.com

Many thanks in advance.

Rob
Responses (5)
youreinlucknow
youreinlucknow
Accepted Answer Pending Moderation
0
Votes
Undo
I was able to get content to fit the iPhone by adjusting the Width % in Template.CSS to 69%. On the mobile phone emulator I use, 69% was the 'zoom' level that fit the content nicely so I used that number. Still looks OK on a desktop and Blackberry.

Maybe there's a better way to do it?
  1. more than a month ago
  2. Commercial Templates
  3. # 1
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Rob

Your width solution should work fine.

For the header height instead of using the following to adjust the height..

[code type=css]min-height: 108px;[/code]

Try changing this to...

[code type=css]height: 108px;[/code]

This should keep your height the same across all devices.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 2
youreinlucknow
youreinlucknow
Accepted Answer Pending Moderation
0
Votes
Undo
Thanks. Changing "min-height" to "height" did work....although I have another related problem now....

When viewed with a mobile device the nav menu appears below the header area - on a desk top it appears in the header below the logo. It did it before and it still does that - and that's fine.

The problem is that now when viewed on a mobile, the menu appears over or on-top of the content.

I can't seem to figure out how to fix this. Any ideas?
  1. more than a month ago
  2. Commercial Templates
  3. # 3
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Rob

May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 4
youreinlucknow
youreinlucknow
Accepted Answer Pending Moderation
0
Votes
Undo
Thanks so much Ciaran for resolving the site header/menu issues I was having.

You're the best/

Cheers,
  1. more than a month ago
  2. Commercial Templates
  3. # 5
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!