HTML vs CSS'te "text align" kodu yazılmasına rağmen yazı konumlandırılmıyor

kaygusuzronin · 2 Eylül 2023

P etiketine atadığım classa, text align kodunu yazmama rağmen yazıyı konumlandırmıyor fakat div etiketine atadığım classa, aynı komutu yazınca yazı konumlanabiliyor. Tam tersi olması gerekmiyor mu?

Sobarlas · 2 Eylül 2023

kaygusuzronin dedi:
P etiketine atadığım classa, text align kodunu yazmama rağmen yazıyı konumlandırmıyor fakat div etiketine atadığım classa, aynı komutu yazınca yazı konumlanabiliyor. Tam tersi olması gerekmiyor mu?

Hocam HTML'i yeni mi öğreniyorsunuz

kaygusuzronin · 2 Eylül 2023

Sobarlas dedi:
Hocam HTML'i yeni mi öğreniyorsunuz.

Evet.

Nullo · 2 Eylül 2023

CSS:

display: inline;

kodunu kaldırıp dener misin?

kaygusuzronin · 2 Eylül 2023

Nullo dedi:
CSS:

display: inline;

kodunu kaldırıp dener misin?

Kodu kaldırınca ortalanıyor fakat kaldırmadığımda niye olmuyor?

AhmetKnKc · 2 Eylül 2023

kaygusuzronin dedi:
Kodu kaldırınca ortalanıyor fakat kaldırmadığımda niye olmuyor?

Aslında p etiketi ortalanıyor. Fakat asıl sıkıntı display:inline; kullandığınızda p etiketi sadece içeriği kadar yer kaplıyor. Eğer her şeye border verir isek dediğimi anlayacaksınız.

delikarga · 2 Eylül 2023

CSS:

.kutu {
    display:flex;
    justify-content:center;
    align-items:center;
}

kaygusuzronin · 3 Eylül 2023

AhmetKnKc dedi:
Aslında p etiketi ortalanıyor. Fakat asıl sıkıntı display:inline; kullandığınızda p etiketi sadece içeriği kadar yer kaplıyor. Eğer her şeye border verir isek dediğimi anlayacaksınız.

Eki Görüntüle 1928548

Peki, bu iki yazı arasındaki boşluğu margin ile mi kaldırırdınız yoksa position komutuyla mı yoksa başka bir komutla mı?

AhmetKnKc · 3 Eylül 2023

kaygusuzronin dedi:
Peki, bu iki yazı arasındaki boşluğu margin ile mi kaldırırdınız yoksa position komutuyla mı yoksa başka bir komutla mı?

Buradaki kodu paylaşabilirseniz ona göre bir karar verebilirim.

kaygusuzronin · 3 Eylül 2023

Kod:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .kutu
        {
            background-color: aqua;
            width: 100px;
            height: 100px;
        }
        .bir
        {
            text-align: center;
            border: 1px solid red;
        }
        .iki
        {
            text-align: center;
            border: 1px solid red;
        }
    </style>
</head>
<body>
    
    <div class="kutu">
        <p class="bir">
            bir
        </p>
        <p class="iki">
            iki
        </p>
    </div>

</body>
</html>

Şunu paylaşmayı unutmuşum.

HTML vs CSS'te "text align" kodu yazılmasına rağmen yazı konumlandırılmıyor

kaygusuzronin

Centipat

Dosya Ekleri

Sobarlas

Hectopat

kaygusuzronin

Centipat

Nullo

Kilopat

kaygusuzronin

Centipat

AhmetKnKc

Megapat

delikarga

Kilopat

kaygusuzronin

Centipat

Dosya Ekleri

AhmetKnKc

Megapat

kaygusuzronin

Centipat

Dosya Ekleri