2010-03-12 20 views
5

Aşağıdaki html ve css'leri kullanıyorum. Ama anlayamadığım şey, sekmelerin ana divın sağında nasıl yer almasıdır. Böylece yer işaretleri gibi sağa yapışıyorlar.Bir divanın diğerinin sağına yerleştirilmesi

.main { 
    -moz-border-radius:10px; 
    height: 75%; 
    width: 60%; 
    position: absolute; 
    top: 15%; 
    left: 20%; 
    right: auto; 
    } 
.tabs { 
    width: 50px; 
    height: 1.3em; 
    position: absolute; 
    float: right; 
} 
#tab { margin: 10px 10px 10px 0px;} 

Ve html:

<div class="main"> 
    <div id="content"> 
     Some main content 
    </div> 
</div> 
<div class="tabs"> 
    <div class="tabs" id="tab1"> 
     <a href="#" alt="Home"> 
      Home 
     </a> 
     </div> 
     <div class="tabs" id="tab2"> 
      <a href="#" alt="About"> 
       About 
      </a> 
     </div> 
</div> 
+0

Kimlikler benzersiz olmalı - satırdaki sorunları önlemek için #tab .tab içine alın. Ayrıca, çapaların alt özellikleri yoktur. Bunun yerine başlık deneyin. –

cevap

15

koyarak blokların iki genel yaklaşım soldan sağa vardır:

  1. bunları satır içi olun; veya
  2. Şamandıraları kullanın.

(1) olacaktır:

div.main, div.tabs { display: inline; } 

(2) olacaktır: Eğer (2) bir kapta div'leri koyup yoksa

div.main, div.tabs { float: left; } 

ekleyin:

div.container { overflow: hidden; } 

Her yöntemin belirli özellikleri vardır. En önemlisi inline öğelerine, bunlara uygulanan margin öznitelikleri olamaz. Bu, HTML'deki satır içi ve blok düzeni üzerindeki çeşitli kısıtlamalardan sadece biridir.

+0

Hala bunu işe alamıyorum. Konteyneri veya içeriğini hiç göstermez. Herşeyi yapıştırdım çünkü belki de sorun şu anda yayınladığımın ötesindedir: http://pastebin.ws/6v9lft –

İlgili konular