HTML-контент справа от карты Google - PullRequest
3 голосов
/ 02 февраля 2012

Я пытаюсь добавить в свою программу Javascript меню, которое позволит пользователю делать разные вещи. Я не большой гуру HTML, поэтому я не знаю, как держать меню в верхней и правой части страницы. Я попытался использовать div, но он просто поместил его под карту, а не справа от него. Вот скриншот того, как это выглядит в браузере: enter image description here

Пробел справа - это то место, где я хотел бы разместить меню. Кто-нибудь может привести пример того, как я бы поставил там стол? Вот как выглядит мой HTML-код:

  <body onload="initMap()">
    <div id="map_canvas" style="width:85%; height:100%"></div>
  </body>

Ответы [ 2 ]

4 голосов
/ 02 февраля 2012

Чтобы получить два DIV бок о бок (касаясь), я обычно устанавливаю оба параметра: float: left. Примерно так:

   <body onload="initMap()">
    <div id="map_canvas" style="float:left; width:85%; height:100%"></div>
    <div id="map_side" style="float:left; width:15%; height:100%"></div>
   </body>

Если вы укажете float: right во втором div, он будет «прилипать» к правой стороне окна браузера, а не к div рядом с ним.

1 голос
/ 02 февраля 2012
<body onload="initMap()">
    <div id="wrapper"> <!-- not strictly necessary, but good practice IMHO -->
        <div id="map_canvas" style="float:left; width:80%; height:100%">
        </div>
        <div id="your-new-div" style="float:right; width:15%;">
        </div>
    </div>
</body> 

Здесь лучше использовать div, чем таблицу ... попробуйте вышеизложенное и дайте мне знать, как вы разбираетесь.

Число с плавающей точкой: справа прилипает меню к правой стороне экрана. Я всегда устанавливаю общую ширину чуть меньше 100% - таким образом, когда вы неизбежно добавите отступы / поля, у вас будет немного места для маневра.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...