Nasıl CSS divs için Linke mola Engellenir?

4 Cevap php

Ben bir web sitesi için menü oluşturma. her madde için (Ev, Hakkımızda, Bize Ulaşın) Ben Arkaplan rengi ve boyutu 125X30 metni kullanın. I şamandıra kullandığınızda CSS, bu doğru çalışır. I şamandıra kaldırıldı Ama, ev gibi tüm bireysel öğe, birer birer gelip vb başvurun. Ben şamandıra olmadan tek bir satır soldan sağa gerekir. Bana yardım edin

4 Cevap

Rajasekar,

CSSplay'i sunar Stu Nicholls yüzer kullanmadan aşağıdaki yatay menü vardır:

CSS

.menu {display:inline-block;}
.menu {display:inline;}
.holder {display:table;}

.menu {
  display:table-row;
  padding:0;
  margin:0;
  list-style-type:none;
  white-space:nowrap; 
  }
.menu li {display:inline;}
.menu a, .menu a:visited {
  display:block;
  float:left;
  padding:4px 16px;
  color:#000; 
  background:#d4d4d4; 
  border:1px solid #fff; 
  text-decoration:none;
  }
.menu a:hover {
  color:#fff; 
  background:#08c;
  }

#wrapper1 {text-align:left;}
#wrapper1 .holder {margin:0;

html

<div id="wrapper1">
<div class="holder">
<ul class="menu">
<li><a href="#nogo">Tab One</a></li>
<li><a href="#nogo">Tab Two: Longer</a></li>
<li><a href="#nogo">Tab Three: Longest</a></li>
<li><a href="#nogo">Tab Four</a></li>

</ul>
</div>
</div>

(Ekranın kullanımı dahil: inline-block) Ayrıntılı açıklama is on CSSplay.

Şamandıra çalışıyorsa, ben ile yapışmasını tavsiye ederim - bu sorunların ortak bir kaynağı olduğu için sadece, sonra bir temizleme elemanı gerekebilir.

Eğer gerçekten yüzen ile gidemez, kullanmak olabilir display: inline-block

(: Div, li, s ex) Kişisel ürün bir blok düzeyi öğesi içinde muhtemelen.

Kısacası: sonuncusu altında Blok elemanları,. Son birinin yanındaki inline.

Siz inline olarak öğeleri yapmak gerekir. Basitçe Inlines ile blok seviyesi etiketleri değiştirmek (ex: açıklık) veya display: inline veya display: inline-block ile stil onları.

Sen bazı olasılıkları var, ama şamandıra iyi yol olduğunu düşünüyorum.

  1. Inline-block (ama tavsiye etmem): Eğer ekran div bulunuyor ayarlayabilirsiniz
  2. Ayrıca mutlak konumlandırmayı yapabilirdi, ama bu da hiç düzgün bir çözümdür.

etiketler