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!

Site Links

Recommended

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters the trademark holder in the United States and other countries.