Çıkışına en iyi yöntem benim PHP döngü doğru HTML nedir

2 Cevap php

I have a problem, I have a HTML problem, I don't know if i'm using the best method, so here is my problem: Everthing is ok:http://screencast.com/t/uJmffaxE
If i have more space, here are starting the problems: http://screencast.com/t/1z1GRhOLK
Here is my code:

<div id="wrap-categories" class="clearfix">
<?php if($this->categories !== false): ?>
	<ul>
	<?php foreach($this->categories as $category):?>
		<li>
			<strong><?=$category['name']?></strong><br />
		<?php if($this->artistsHelper($category['id']) !== false): ?>
			<?php foreach($this->artistsHelper($category['id']) as $artist): ?>
				<p><?=$artist['name']?></p>
			<?php endforeach; ?>	
		<?php endif; ?>
		</li>	
	<?php endforeach; ?>
	</ul>
<?php endif; ?>

And here is how the markup looks like, when is generated:

    		<div id="wrap-categories" class="clearfix">

								<ul>
										<li>
						<strong>Dj's</strong><br />
																				<p>Big fuckin'artists</p>
														<p>asddssdadsasda</p>
														<p>Gigle bossu</p>

											</li>	
										<li>

						<strong>Make up</strong><br />
																				<p>Cool</p>

											</li>	
										<li>
						<strong>Mamam</strong><br />
											</li>	
										<li>
						<strong>Tata</strong><br />

											</li>	
										<li>
						<strong>Dawaj</strong><br />
											</li>	
										<li>
						<strong>Sexy</strong><br />
											</li>	
										<li>
						<strong>Bitch</strong><br />

											</li>	
										<li>
						<strong>Armin</strong><br />
											</li>	
										<li>
						<strong>Lol</strong><br />
											</li>	
										<li>
						<strong>Gogu</strong><br />

											</li>	
										<li>
						<strong>Penal</strong><br />
											</li>	
										<li>
						<strong>Asasin</strong><br />
											</li>	
									</ul>
						</div>

The css

#wrap-categories ul li{
float:left;
margin-right:10px;
}

Herhangi bir yardım lütfen!

2 Cevap

Mücadele için çeşitli sorunlar vardır. Birincisi, UL Un-sipariş listesi açılımı ve yaşadığınız tüm orada verilerin ilk sütun ise harika. Ben sadece bu kadar UL yanlış ebeveyn etiketi, (yatay eksen üzerinde) daha fazla veri sütunlarını doldurmak için ihtiyaç olacağını varsayabiliriz. were Doğru bir etiket varsa, etiketleri (liste öğesi için) açılış ve kapanış LI eklemek gerekir.

@ Jonathan Sampson'ın açıklama doğrudur. Çevrimiçi kötü tablolar nasıl söyleyerek, ve düzeni amaçlar için kötüye zaman doğrudur burada ve başka yerlerde mesajların bir sürü göreceksiniz. Based on what you have shown us, you have tabular data and that should, bir ebeveyn olarak bir tablo etiketini kullanıyor olması.

Update

Ben senin verilerin doğasını yanlış görünür. Ileri ve geri gidiyor sonra, this çözümdür:

<style type="text/css">

     .column
     {
          float: left;
          display: inline;
          clear: none;
          margin: 0 5px;
     }

     .column UL LI 
     {
          list-style: none;
     }


     .category
     {
         font-weight: bold;
     }
 </style>

 <div> <!-- this is an outer/wrapper/container -->
 <?php if($this->categories !== false): ?>
    <?php foreach($this->categories as $category):?>
        <div class="column">
            <ul>
                <li class="category"><?=$category['name']?></li> <!-- header data... -->
            <?php if($this->artistsHelper($category['id']) !== false): ?>
                    <?php foreach($this->artistsHelper($category['id']) as $artist): ?>
                            <li><?=$artist['name']?></li> <!-- no class info here because its just text -->
                    <?php endforeach; ?>    
            <?php endif; ?>
            </ul>
         </div>   
    <?php endforeach; ?>
    </div>

Birkaç burada yayınlanan ne farklar ve ne ile başlayan vardır:

  • Bir kayan DIV her sütun sarmak
  • Lis bir çift her "sanatçı" wrap
  • Bir kap DIV şeyi sarın
  • Stil sayfasında üstbilgi satırı görünümünü ayarlamak

i çalışmasını sağlamak için stil (css) kullanmak zorunda düşünüyorum. listenize içine sabit bir genişliğe eklemeyi deneyin.