HTML <p> etiketini <div> etiketi ittiriyor

P

Phoque

Decapat
Katılım
24 Şubat 2023
Mesajlar
201
Çözümler
2
Yer
İzmir
Daha fazla  
Cinsiyet
Erkek
Merhaba, ekte gösterdiğim gibi bir itme var, mesela yandaki yazıya margin-right verdiğimde onunla birlikte 01 yazısıda sürükleniyor. Yani sorum <p> etiketinin <div>'in altına koyabilmemin bir yolu var mı? Yani ekteki sarı yerlere getirebilme ihtimalim?
 

Dosya Ekleri

  • Ekran görüntüsü 2023-07-11 162256.png
    8,5 KB · Görüntüleme: 61
Son düzenleyen: Moderatör:
Her iki öğenin dahil olduğu ana kapsayıcı CSS'ine içine şu kodları girip dener misiniz?

CSS: 
/* container olan yeri kapsayıcı isminiz ile değiştiriniz */
#container{
    justify-content: center; display: flex; align-items: center; flex-direction: column;
}
 

Olmadı.
 
300319 dedi:
@Phoque kodunuzu atar mısınız?
Genişletmek için tıkla...

HTML: 
<div class="col-sm-8" style="margin-top: 50px;">
    <div class="col-sm-8 container" style="height: 300px; width: 250px; background-color: #494b50; color: #ffff ; padding: 0px;">
        <div class="container col-sm-3" style="color: #ffffff; background-color: #4f5156; height: 60px; width:60px;
        margin-bottom: 150px; font-size: large; font-weight: 600; margin-left: 25px; border-radius: 100px; display: flex;">01</div>
        <p>Web Tasarım</p>   <!--BU YAZI DIV'IN ALTINA GECICEK-->
    </div>
</div>
 
@Phoque böyle dener misiniz?

HTML: 
<div class="col-sm-8" style="margin-top: 50px;">
    <div class="col-sm-8 container" style="height: 300px; width: 250px; background-color: #494b50; color: #ffff ; padding: 0px;">
        <div class="container col-sm-3" style="color: #ffffff; display:block; background-color: #4f5156; height: 60px; width:60px;
        margin-bottom: 150px; font-size: large; font-weight: 600; margin-left: 25px; border-radius: 100px; display: flex;">01</div>
 
    </div>
         <p>Web Tasarım</p>   <!--BU YAZI DIV'IN ALTINA GECICEK-->
</div>

Veya böyle;

HTML: 
<div class="col-sm-8" style="margin-top: 50px;">
    <div class="col-sm-8 container" style="height: 300px; width: 250px; background-color: #494b50; color: #ffff ; padding: 0px;">
        <div class="container col-sm-3" style="color: #ffffff; display:block; background-color: #4f5156; height: 60px; width:60px;
        margin-bottom: 150px; font-size: large; font-weight: 600; margin-left: 25px; border-radius: 100px; display: flex;">01</div>
    <p>Web Tasarım</p>   <!--BU YAZI DIV'IN ALTINA GECICEK-->
    </div>
     
</div>
 
Sonuç bu oluyor hocam.
 

Dosya Ekleri

  • Ekran görüntüsü 2023-07-11 170419.png
    6,7 KB · Görüntüleme: 37
@Phoque bir kod daha attım. Onu dener misiniz?
 
Konuyu cevapla
Menü
Giriş yap
Kaydol
Bu siteyi kullanmak için çerezler gereklidir. Siteyi kullanmaya devam etmek için çerezleri kabul etmelisiniz. Daha Fazlasını Öğren.…