v2.5.2
Giriş yap

navbar' ı nasıl ekranın en aşağısına koyarım?

bukr3j
339 defa görüntülendi ve 1 kişi tarafından değerlendirildi
1 1 
<nav class="navbar-bottom">
    <div class="container-fluid">
        <div class="row">
            <div id="c1" class="col-xl col-lg col-md col-sm-4 d-flex align-items-center">
                <p class="footer-text">copyright<br>2016-2022</p>
            </div>
            <div class="col">
                <div class="social">
                  <div id="logos" class="row" style="max-width: 520px !important">
                    <div class="col my-auto align-items-center">
                      <a href="https://www.teknoparkistanbul.com.tr/" alt="Teknopark İstanbul Web Sitesi">
                        <img src="../img/teknoparkistlogo.svg" alt="" class="align-items-center footer-resimler d-flex" style="width: 100% !important">
                      </a>
                    </div>
                    <div class="col my-auto align-items-center">
                      <a href="https://www.yasad.org/">
                        <img src="../img/yasadlogo.svg" alt="" class="align-items-center footer-resimler d-flex" style="width: 100% !important">
                      </a>
                    </div>
                    <div class="col my-auto align-items-center">
                      <a href="https://www.sahaistanbul.org.tr/">
                        <img src="../img/sahalogo.svg" alt="" class="align-items-center footer-resimler d-flex" style="width: 100% !important">
                      </a>
                    </div>
                    <div class="col my-auto align-items-center">
                        <img src="../img/yerliuretim.svg" alt="" class="align-items-center footer-resimler d-flex" style="width: 100% !important">
                    </div>	
                </div>
            </div>
        </div>
        <div id="c2" class="col-xl col-lg col-md col-sm-2 d-flex align-items-center">
            <p class="footer-text">copyright<br>2016-2022</p>
        </div>
    </div>
  </div>
</nav>
HTML

bunu ekranın en altına nasıl koyarım?


        .navbar-bottom .social{
          float: none !important;
          justify-content: center !important
        }
        .navbar-bottom {
	position: relative;
	left: 0;
	width: 100%;
	bottom: 0;
	padding: 0rem 3rem;
	font-family: Karla, sans-serif;
	color: #000;
	background: rgb(255, 255, 250);
  }
  .navbar-bottom .social {
	position: relative;
	z-index: 8888;
	float: right;
  }
  .navbar-bottom .copy {
	float: right;
	position: relative;
	z-index: 10;
  }
CSS
css html
Cevap yaz
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
Cevaplar (1)
codepacks
1095 gün önce
<div class="navbar">
  <a href="#ev" class="active">Ev</a>
  <a href="#araba">Araba</a>
  <a href="#tren">Tren</a>
</div>  

stil 

.navbar {
  background-color: #333;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  width: 100%;
}

.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.navbar a:hover {
  background-color: #ddd;
  color: black;
}

.navbar a.active {
  background-color: #04AA6D;
  color: white;
}
1
#009745