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
    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;
}
 
300319 dedi:
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;
}
Genişletmek için tıkla...

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>
 
300319 dedi:
@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>
Genişletmek için tıkla...
Sonuç bu oluyor hocam.
 

Dosya Ekleri

  • Ekran görüntüsü 2023-07-11 170419.png
    Ekran görüntüsü 2023-07-11 170419.png
    6,7 KB · Görüntüleme: 37

Benzer konular

emregunel0
HTML <div> yanına yeni div nasıl açılır?
Mesaj
3
Görüntüleme
1.189
emregunel0
emregunel0
B
HTML CSS div nasıl konumlandırılır?
Mesaj
7
Görüntüleme
574
WoqZ
WoqZ
metmellow
HTML NAV ve DIV kırmızı gözüküyor
Mesaj
6
Görüntüleme
1.044
metmellow
metmellow
Tony0
  • Soru
HTML div içinde sayfa açmak
Mesaj
1
Görüntüleme
1.659
yapiciege45
yapiciege45
Tony0
  • Soru
HTML frame içine div eklemek
Mesaj
2
Görüntüleme
1.370
Tony0
Tony0

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı