none
CSS Вставка изображения между элементами внутри DIV RRS feed

  • Вопрос

  • Здравствуйте.

    Хотелось бы при помощи CSS вставить между двумя элементами input изображение. 

    .group input:first-child::after - эту строчку я как только не переписывал, но все равно изображение не появлялось.

    Изображение появилось только в таком варианте .group::after, но этот вариант мне не подходит.

    Код:

    <style>
    .group input:first-child::after {
                    background: transparent url('arrow_right.png') no-repeat;
                    background-size: 30px 15px;
                    display: inline-block;
                    width: 30px;
                    height: 15px;
                    content: "";
                    vertical-align: middle;
                }
    </style>
    
    <div class="group">
            <input type="button" value="Left" />
            <input type="button" value="Right" />
        </div>

    Вот как должно быть. 

    Возможно ли это?

    Спасибо!



    • Изменено Alexey110 20 октября 2016 г. 7:53
    20 октября 2016 г. 7:50

Ответы

  • Ну разве что использовать абсолютное позиционирование. А лучше на мой взгляд туда разместить реальный элемент и у него задать фон.

    Сделаем содержимое сообщества лучше, вместе!

    20 октября 2016 г. 19:28
    Модератор

Все ответы

  • Ну разве что использовать абсолютное позиционирование. А лучше на мой взгляд туда разместить реальный элемент и у него задать фон.

    Сделаем содержимое сообщества лучше, вместе!

    20 октября 2016 г. 19:28
    Модератор
  • Спасибо. Жаль, просто у меня динамически создаются элементы в таблице  хотелось, чтобы дизайн не прыгал, так как JavaScript вставляет элемент после того, как страница уже готова и видно, как он(JavaScript ) изменяет элемент, с CSS думаю такого не происходит, но и с JavaScript, как говорится "жить можно"

    Спасибо!


    21 октября 2016 г. 7:35