Блог

Главная - Вопросы по программированию - установите значок слева в CSS и HTML

установите значок слева в CSS и HTML

#html #css

Вопрос:

Я создаю приложение, и я новичок в css том, что я застрял на проблеме.

Я пытаюсь переместить значок left and up , НО он все еще включен right corner , я тоже пытался text-align :center; , но это не сработало.

template.html

 
<style>

.icon-form-container button {
    background-color: #f5f8f9;
}

.icon-edit-container button,
.icon-form-container button {
    border-radius: 50%;
    height: 10vw;
    width: 10vw;
    max-width: 90px;
    max-height: 90px;
    min-width: 74px;
    min-height: 74px;
    font-size: 2.7em;
    color: #acd8aa;
    outline: none;
    border: none;
}


</style>




    <div class="icon-form-container">
        <button id="receiver-input" onclick="send_link({{ user.id }})" ><i class="far fa-smile grid-wink"></i></button>
    </div>

Когда я запускаю это, значок продолжает отображаться в правом углу.

Я понятия не имею, что не так в css.

Любая помощь была бы очень признательна.

Заранее спасибо.

Комментарии:

1. Странно, запуск вашего точного кода на моей машине (браузер firefox) кнопка уже находится в левом верхнем углу, есть ли что-то еще в вашем коде?

2. Нет, сэр, когда я добавляю right: 10px; bottom: 600px; инициализацию, тогда это сработало, и теперь я думаю, что смогу сделать это слева.

3. Итак, вы пытаетесь переместить значок внутри кнопки из середины в верхний левый угол кнопки? Извините, я не понимаю, чего вы хотите достичь

Ответ №1:

 .icon-edit-container button,
.icon-form-container button {
  position: relative;
  left: 0px;
  top: 0px
}

Это должно поместить изображение в верхний левый угол.

Комментарии:

1. Большое вам спасибо, но когда я добавляю right: 10px;bottom: 600px; , это сработало

Метки: