Задать вопрос

Medvejonok86

Ответы пользователя по тегу CSS

  • Почему не работает задание размеров радиального градиента в процентах "radial-gradient()"?

    @Medvejonok86
    У вас неправильно указан размер градиента. Нужно указать его в единицах измерения, отличных от процента(%).
    background: radial-gradient(circle 20px at 50% 50%, blue , red);

    Или как вариант, можете указать позиции цвета:
    background: radial-gradient(circle at 50% 50%, blue 10% , red 20%);

    UPD:
    Так же можно задать ширину и высоту градиента в процентах без явного указания формы градиента:
    background: radial-gradient(20% 20% at 50% 50%, blue, red);
    Ответ написан
    3 комментария
    3 комментария

  • Первый раз делаю верстку сайта. Как исправить данную ситуацию, так, чтобы "icebeaker_main_block" был справа?

    @Medvejonok86
    1-й вариант: использовать float.
    .header_txt__block {
    width: 634px;
    float: left;
    text-align: left;
}
.icebeaker_main_block {
    background: rgba(51, 51, 51, 0.30);
    float: right;
}

    2-й вариант: использовать flex.
    Оборачиваем оба блока в div с классом "wrapper":
    <div class="wrapper">
  <div class="header_txt__block">...</div>
  <div class="icebeaker_main_block">...</div>
</div>

    и редактируем css:
    .wrapper {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
}
.header_txt__block {
    width: 634px;
    text-align: left;
}
.icebeaker_main_block {
    background: rgba(51, 51, 51, 0.30);
}

    3-й способ: использовать grid.
    Оборачиваем оба блока в div с классом "wrapper":
    <div class="wrapper">
  <div class="header_txt__block">...</div>
  <div class="icebeaker_main_block">...</div>
</div>

    и редактируем css:
    .wrapper {
    display: grid;
    grid-template-areas: "left_block right_block";
}
.header_txt__block {
    width: 634px;
    text-align: left;
    grid-area: left_block;
}
.icebeaker_main_block {
    background: rgba(51, 51, 51, 0.30);
    grid-area: right_block;
}
    Ответ написан
    1 комментарий
    1 комментарий