Проблема с HTML-тегом li в jquery mobile - PullRequest
0 голосов
/ 18 апреля 2011


Я пытаюсь отобразить изображение и текст в одной строке, и изображение, и текст кликабельны и указывают на какую-то ссылку.Я использую jquery.mobile-1.0a4.1.
Однако в приведенном ниже коде показано, что Stuff1 и Description перекрываются изображением, поэтому изображение находится спереди, а текст - в фоне.Я хочу, чтобы изображение и текст располагались рядом, в чем может быть проблема в приведенном ниже коде?

   <li> 
<img src="images/someImage.png" /> 
<h3><a href="#someID" >Stuff1</a></h3> 
<p>Some Description</p> 
<a href="#someID" >Stuff2</a> 
</li>

Ответы [ 2 ]

2 голосов
/ 18 апреля 2011

В примере на сайте jQuery.mobile вы должны обернуть весь внутренний html li в вашей ссылке, например так:

<li> 
  <a href="#someID">
    <img src="images/someImage.png" /> 
    <h3>Stuff1</h3> 
    <p>Some Description</p>
  </a>
</li>

Однако, похоже, что вывозможно пытается получить две разные ссылки в одном теге li.В мобильном приложении это действительно невозможно (но я могу ошибаться в том, что вы пытаетесь сделать)

Ссылка: http://jquerymobile.com/demos/1.0a4.1/docs/lists/lists-thumbnails.html

0 голосов
/ 18 апреля 2011

установить float на все.Также, если возможно, вставьте все, кроме изображения, внутри div, а затем установите img и div на float: left.Как:

<li> 
 <img src="images/someImage.png" /> 
 <div>
  <h3><a href="#someID" >Stuff1</a></h3> 
  <p>Some Description</p> 
  <a href="#someID" >Stuff2</a> 
  </div>
</li>

и CSS:

li img{float:left;}
li div{float:left;}
...