Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Resizing a Google Map Info Window

Posted on 2014-12-21
2
Medium Priority
?
471 Views
Last Modified: 2014-12-21
My website incorporates an API v3 Google Map at www.mauitradewinds.com/location.htm.  An info window with text "Maui Tradewinds" is supposed to appear when visitors click or tap the map location marker, and up until recently this worked on a desktop, iPad and iPhone.   iPhone visitors are redirected to www.mauitradewinds.com/m_location.htm 

I just noticed, on iPad and iPhone, that the info window text is incomplete ("Maui____"  instead of Maui Tradewinds).  However, if I include "<br>" between "Maui" and "Tradewinds", then both words are displayed, on separate lines. I've no clue as to what caused this change, and I'm an amateur at coding.  Perhaps this is related to Apples' recent release of iOS 8,  which I have just installed on my iPad and iPhone.  In any event, the issue seems related to the size of the Info Window.  If I can make the window wider, I believe the entire text will be displayed with iOS devices.  

Please advise how to control the size of the Info Window.
0
Comment
Question by:ddantes
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 43

Accepted Solution

by:
Rob earned 2000 total points
ID: 40512127
It's to do with the width of the element and the overflow settings:

<div style="overflow: auto; width: 98px; height: 24px;">
    <div class="" style="overflow: hidden;width: 100px;">Maui Tradewinds</div>
</div>

change this to

<div style="overflow: hidden; width: 100px; height: 24px;">
    <div class="" style="overflow: hidden;width: 100px;">Maui Tradewinds</div>
</div>
0
 

Author Comment

by:ddantes
ID: 40512137
That did it.  Thanks!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

How to take pictures with depth using iOS 10
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

618 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question