Forum PHP.pl > [CSS][HTML]Dwie Kolumny Kołosiebie

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS][HTML]Dwie Kolumny Kołosiebie

rayan17

28.04.2015, 19:49:35

Witam was
Chciałbym mieć dwie Kolumny Kołosiebie ,jedna to zdecydowanie zamało
pytanko czy da się z tego zrobić Dwie Kolumy kołosiebie?

Kod

<div class="content-right-column">
    <style>
        ul.items_serie{
        list-style:none;
        margin: 0;
        padding: 0;
        }

        .head_serie{
          border-top: 1px solid #ececec;
          border-right: 1px solid #ffffff;
          border-bottom: 1px solid #ececec;
          border-left: 1px solid #ffffff;
          cursor: pointer;
          margin: 5px 0;
          padding: 8px 11px;
          background: rgba(243, 69, 60, 0.29);
          width:100%;
        }

        .head_serie a{
          color: #fff;
        }

ul.items_serie li{
border-top: 1px solid #999999;
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ececec;
  border-left: 1px solid #ffffff;
  color: #797979;
  cursor: pointer;
  margin: 5px 0;
  padding: 8px 11px;
  background: rgb(241, 241, 241);
  width:100%;
  }

  ul.items_serie li a{
  color:#8B8B8B;
  }
  ul.items_serie li.selected_serie{
  background:rgb(224, 255, 202);
  }
  ul.items_serie li:hover{
  background:rgb(224, 255, 202);
  }
    </style>

fate

29.04.2015, 13:08:04

Tak,
Pytanie powinno brzmieć jak je zrobić
http://www.w3schools.com/css/tryit.asp?fil...s3_column-count

rayan17

29.04.2015, 18:00:14

No tak sorry all.
Ale po tylu godzinach przy kompie to nawet wytrwali kapitulują .

Dięki Wielkie za TIPA.
Pomogło rozwiązać problem.
Pozdro.

Kod

<div class="content-center-column">
    <style>
        ul.items_serie{
        -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
        }

        .head_serie{
          border-top: 1px solid #ececec;
          border-right: 1px solid #ffffff;
          border-bottom: 1px solid #ececec;
          border-left: 1px solid #ffffff;
          cursor: pointer;
          margin: 5px 0;
          padding: 8px 11px;
          background: rgba(243, 69, 60, 0.29);
          width:100%;
        }

        .head_serie a{
          color: #fff;
        }

ul.items_serie li{
border-top: 1px solid #ececec;
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ececec;
  border-left: 1px solid #ffffff;
  color: #797979;
  cursor: pointer;
  margin: 5px 0;
  padding: 8px 11px;
  background: rgb(241, 241, 241);
  width:100%;
  }

  ul.items_serie li a{
  color:#8B8B8B;
  }
  ul.items_serie li.selected_serie{
  background:rgb(224, 255, 202);
  }
  ul.items_serie li:hover{
  background:rgb(245, 245, 220);
  }
    </style>

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.