Peršokti į turinį
  • ŽAIDIMAI
  • , ŽAIDIMAI
  • ŽAIDIMAI

Problema lygiuojant elementus horizontaliai HTML

Alpha23

Parašė Alpha23
forume Programavimas

 Pasidalinti

Ši tema yra neaktyvi. Paskutinis pranešimas šioje temoje buvo prieš 651 dienas (-ų). Patariame sukurti naują temą, o ne rašyti naują pranešimą.

Už neaktyvių temų prikėlimą galite sulaukti įspėjimo ir pranešimo pašalinimo!

Recommended Posts

Alpha23 Žalias (-ia)

Alpha23

Šiuo metu dirbu su tinklalapiu ir bandau sulygiuoti kelis elementus horizontaliai konteinerio div. Tačiau, nepaisant mano bandymų, atrodo, kad elementai nėra tinkamai suderinti. Šiam išdėstymui naudoju HTML ir CSS.

Štai mano dabartinis kodo fragmentas: 

<!DOCTYPE html>
<html>
<head>
    <title>Horizontal Alignment Issue</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
    <div class="container">
        <div class="element">Element 1</div>
        <div class="element">Element 2</div>
        <div class="element">Element 3</div>
    </div>
</body>
</html>

Ir susijęs CSS „styles.css“: 

.container {
    /* Code for container styles */
}

.element {
    /* Code for element styles */
}

Būčiau dėkingas už bet kokią pagalbą ar pasiūlymus, kaip tinkamai suderinti šiuos elementus horizontaliai konteineryje. Ar yra kokios nors konkrečios CSS savybės ar technikos, kurios man trūksta? Iš anksto dėkojame už jūsų kompetenciją!

newyorkas Forumo numylėtinis (-ė)

newyorkas

jeigu gerai supratau, tai tau šito reik;
  

<!DOCTYPE html>
<html>

<head>
    <title>Horizontal Alignment Issue</title>
    <style>
        .container {
            display: flex;
        }
        .element {
            margin: 5px;
        }
    </style>
</head>

<body>
    <div class="container">
        <div class="element">Element 1</div>
        <div class="element">Element 2</div>
        <div class="element">Element 3</div>
    </div>
</body>

</html>

jeigu nori, kad būtų dar ir išcentruoti, tai;

  

<!DOCTYPE html>
<html>

<head>
    <title>Horizontal Alignment Issue</title>
    <style>
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        .element {
            margin: 5px;
        }
    </style>
</head>

<body>
    <div class="container">
        <div class="element">Element 1</div>
        <div class="element">Element 2</div>
        <div class="element">Element 3</div>
    </div>
</body>

</html>

Ši tema yra neaktyvi. Paskutinis pranešimas šioje temoje buvo prieš 651 dienas (-ų). Patariame sukurti naują temą, o ne rašyti naują pranešimą.

Už neaktyvių temų prikėlimą galite sulaukti įspėjimo ir pranešimo pašalinimo!

Prisijungti prie diskusijos

Palikti atsakymą galite iš karto, o užsiregistruoti vėliau. Jeigu jau turite paskyrą mūsų forume, Prisijunkite.

Svečias
Atsakyti šioje temoje...

×   Įklijuotas tekstas turi teksto formatavimą.   Pašalinti teksto formatavimą

  Galimi tik 75 veidukai.

×   Nuoroda buvo automatiškai įterpta.   Įterpti nuorodą paprastai

×   Jūsų ankstesnis pranešimas buvo atkurtas.   Išvalyti redaktorių

×   Jūs negalite įkelti nuotraukas tiesiogiai.Įkelkite arba įdėkite nuotraukas iš URL.

×
 Pasidalinti
Eiti į

  • Šiame puslapyje naršo:   0 nariai

    • Nėra registruotų narių peržiūrinčių šį forumą.

Skelbimai



×
×
  • Sukurti naują...