Search the Community
Showing results for tags 'div'.
-
Merhaba arkadaşlar. Semantic UI Grid sisteminde orta bloğa herhangi bir içerik girdiğim zaman sol ve sağ blok da içerik bloğu ile birlikte aynı büyüklükte oluyor. Ben uzamasın normal divler ile yapılan iskelet gibi birbirinden bağımsız olsun istiyorum. Uğraştım ama sorunu gideremedim. Nasıl düzeltebilirim.? Resimde orta bloğa giriş formu yazılmıştır ama sağ ve sol blok gördüğünüz gibi orta blokla aynı boyutta olmuştur. custemize.css /* Genel Yapı */ .kapsayici { border: 1px solid red!important; margin-top: 10px!important; } .kapsayici2 { margin-top: 20px!important; } /* Menü Sistemi */ .logo { padding-left: 0!important; } .arama { padding-right: 0!important; } .ui.inverted.menu .dropdown .menu { background: #353535!important; } .ui.inverted.menu .dropdown .menu .item { color: white!important; } .ui.inverted.menu .dropdown .menu a:hover.item { background: #494949!important; color: white!important; } /* Grid Sistemi */ .grid-sistem { margin: 10px 0 !important; padding:0 !important; } .aside-left { margin: 0 !important; padding:0 !important; border: 1px solid #ddd; } .content { margin: 0 20px!important; padding:5 !important; border: 1px solid #ddd; } .aside-right { margin: 0 !important; padding:0 !important; border: 1px solid #ddd; } index.php <!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" type="text/css" href="css/reset.css"> <link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"> <link rel="stylesheet" type="text/css" href="css/custemize.css"> <script src="js/jquery-2.1.4.min.js"></script> <script src="js/script.js"></script> <script src="semantic/dist/semantic.min.js"></script> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta charset="UTF-8"> <title>Tasarım</title> </head> <body> <!-- Header --> <header id="Header"> <!-- Navbar --> <nav id="Navbar"> <div class="ui inverted attached stackable menu"> <div class="ui container"> <div class="header item logo"><img src="semantic/examples/assets/images/logo.png"></div> <a class="item"><i class="home icon"></i> Home </a> <a class="active item"><i class="grid layout icon"></i> Browse </a> <a class="item"><i class="mail icon"></i> Messages </a> <div class="ui simple dropdown item"> More <i class="dropdown icon"></i> <div class="menu"> <a class="item"><i class="edit icon"></i> Edit Profile</a> <a class="item"><i class="globe icon"></i> Choose Language</a> <a class="item"><i class="settings icon"></i> Account Settings</a> </div> </div> <div class="right menu"> <div class="item arama"> <div class="ui icon input"> <input type="text" placeholder="Search..."> <i class="search link icon"></i> </div> </div> </div> </div> </div> </nav> <!--# Navbar #--> </header> <!--# Header #--> <!-- Grid --> <div class="ui container kapsayici2"> <div class="ui equal width stackable grid grid-sistem"> <div class="column aside-left"><!-- Sol Blok --> <?php include "aside-left.php"; ?> </div> <div class="eight wide column content"><!-- Orta Blok --> <?php include "content.php"; ?> </div> <div class="column aside-right"><!-- Sağ Blok --> <?php include "aside-right.php"; ?> </div> </div> </div> <!--# Grid #--> </body> </html>