Как заставить изображения игнорировать начальную загрузку контейнера с помощью редактора wysiwyg? - PullRequest
Новая
       27

Как заставить изображения игнорировать начальную загрузку контейнера с помощью редактора wysiwyg?

0 голосов
/ 13 марта 2019

Я создаю блог-сайт и решил использовать tinyMCE при создании блога.Когда пользователь хочет посмотреть мой блог на мобильном устройстве, я бы хотел, чтобы для каждого изображения / gif я вставлял с помощью редактора, чтобы игнорировать начальную загрузку контейнера и заставлять изображения отображаться по всей длине экрана, а не с желобами.Как мне этого добиться?Я пытался использовать приемы позиционирования, но не могу понять это.По какой-то причине tinyMCE вставляет тег ap в качестве родительского элемента каждого изображения.

Вот мой веб-сайт, чтобы увидеть, что я имею в виду тоже

Вот CSS, относящийся кк вопросу: 

@media (min-width: 351px) and (max-width: 576px) {
    h2 {
        font-size: 4.6vh;
    }
    #blogImage {
        width: 100%;
        height: 20em;
        object-fit: cover;
        border-radius: 0px;
    }

    #blogBody img {
        width: 100%;
        /* object-fit: fill; */
        max-height: 100%;
        /* left: -20vw; */

    }

Вот мой маршрут show.ejs 

<div class="container mt-3" id="blogDetails">
        <div class="row">
            <div class="col-lg-6 d-flex flex-column justify-content-center">
                <h2 class="text-left text-primary"><%= blog.title %></h2>
                <p class="lead text-left mb-4 text-secondary"><em><%= blog.subtitle %></em></p>
                <div class="d-flex">
                    <div>
                        <img id="authorPic" src="/images/ryanweb.jpg" alt="Ryan" class="rounded">
                    </div>
                    <div class="ml-3" id="authorInfo">
                        <p class="authorInfo">By Ryan Talbert</p>
                        <p class="text-secondary"> <%= blog.created.toDateString() %></p>
                    </div>
                </div>
            </div>
            <div class="col-12 col-lg-6">
                <img id="blogImage" src="<%= blog.image %>" alt="You will order from GiftGrab and love it!">
            </div>
        </div>
        <div class="row mt-3" id="blogBody">
            <div class="col-lg-8 offset-lg-2 mb-3">

                    <%- blog.body %>

            </div>
        </div>
...