Objektno Orijentisani Pub

bmaxa:
Al zato znam šta valja ČP
Kliknite za proširenje...
Screenshot_1.jpg
 
Sve su to gradivni blokovi koji su u medjusobnoj relaciji. Grupises elemente koji se odnose na istu stvar i pomeras div, a ne svaki element zasebno.

Drugo, ako je forma, bice u tom divu ali ce relacija izmedju tih elemenata vaziti samo za njih, a izvan diva pravila su drugacija
 
Nona2:
nisam pod element mislila bukvalno jedan element

Pa upravo mi to nije jasno-van diva.
Kliknite za proširenje...
To je meni stvaralo problem da sam batalio front end, nista me ne slusa. Lako je ovako kad radis primere da sve nastimujes, ali kad dodje integracija, bukvalno svaki element vodi svoju politiku. Mnogo sam se nervirao oko toga. Najvise me mucilo pozicioniranje elemenata. Nece da me slusaju elementi. z:D
 
Vidis, ja nemam strpljenja.

HTML: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            margin: 0px;
            padding: 0px;
            width: 100%;
            font-family: monospace;
        }
        .body-container {
            display: flex;
            border: 1px solid red;           
            vertical-align: baseline;
            
        }
        .body-container-left{
            flex-basis: 20%;
            background-color: cornflowerblue;

        }
        .body-container-middle{
            flex-basis: auto;
            border: 1px solid red;
            background-color:coral;
        }
        .body-container-right{
            flex-basis: 20%;
            background-color: cornflowerblue;
            text-align: center;
            vertical-align:middle;
        }
    </style>
</head>

<body>
    <div class="body-container">
      
        <div class="body-cont-left">

            <table>
                <tr>
                    <th> Najnovije teme</th>           
                </tr>
                <tr>
                    <td>Pub krstarica</td></tr>
                    <tr><td>Kompjuter mi se zapalio</td></tr>
                    <tr><td>Koju graficku da uzmem</td></tr>
                    <tr><td> Neka tema</td></tr>
                
            </table>

        </div>

        <div class="body-cont-middle">
            <h2>Some random stuff</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo modi soluta, labore distinctio doloribus deleniti ratione rem, molestiae tenetur cum eius esse accusantium illo molestias corporis fuga alias expedita quos!</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo modi soluta, labore distinctio doloribus deleniti ratione rem, molestiae tenetur cum eius esse accusantium illo molestias corporis fuga alias expedita quos!</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo modi soluta, labore distinctio doloribus deleniti ratione rem, molestiae tenetur cum eius esse accusantium illo molestias corporis fuga alias expedita quos!</p>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo modi soluta, labore distinctio doloribus deleniti ratione rem, molestiae tenetur cum eius esse accusantium illo molestias corporis fuga alias expedita quos!</p>


        </div>

        <div class="body-cont-right">
            <ul>
                <li>Home</li>
                <li>About</li>
                <li>Contact</li>
            </ul>

        </div>
    </div>
</body>
</html>
 
Prijavite se ili registrujte da biste poslali poruku.

Back
Top