Есть ли способ удалить поля / отступы для определенных c страниц в Hu go Academi c? - PullRequest
Новая
       70

Есть ли способ удалить поля / отступы для определенных c страниц в Hu go Academi c?

0 голосов
/ 24 апреля 2020

У меня есть iframe объект на странице index.md Ху go Academi c, который я хочу разместить на всю ширину страницы без полей (скриншот прилагается) , Я добавил этот код в файл .md: 

<style>
iframe {
  margin-left: 0;
  padding-left: 0;
}
</style>

Тем не менее, отступ 0 уже там, где iframe в данный момент, поэтому я могу переместить его вправо, но не влево.

Можно ли настроить его для указанных c объектов / страниц?

iframe выглядит следующим образом: 

<iframe src="https://ruslankl.shinyapps.io/roc_simulation/" width=1000 height=1000" frameborder="0"></iframe>

Снимок экрана

1 Ответ

1 голос
/ 24 апреля 2020

Я провел некоторое исследование и нашел эту статью с несколькими лучшими решениями. Мое оригинальное решение сработало, но оно заставило iframe плавать поверх остального содержимого, и мы не хотим этого.

Итак, благодаря статье, упомянутой выше, я пришел к следующему, который работает на вашем сайте: 

iframe {
  height: 1000px; /* Set this to the height you want the iframe to have. */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

Обратите внимание на комментарий после height. Вам необходимо установить фиксированную высоту для iframe, чтобы предотвратить его обрезание. Сначала я установил для него значение 650px, которое, согласно моим расчетам, является высотой загружаемого веб-сайта, но затем я получил полосу прокрутки, и я полагаю, что вы бы предпочли не использовать прокрутку.

Цитировать статью о это на самом деле работает:

Идея здесь такова: pu sh контейнер до точной середины окна браузера с левой стороны: 50%; затем потяните его обратно к левому краю с отрицательным полем -50vw.

И, наконец, единица измерения vw - это единица просмотра , точнее ширина окна просмотра, где 100vw - это 100% ширины области просмотра.

Оригинальный ответ ниже:

Я не проверял это с темой Academi c, но на моем собственном сайте (построено на Ху go, но это не имеет значения) это делает iframe полной шириной страницы, независимо от полей или отступов в контенте: 

iframe {
    left: 0;
    position: absolute;
    width: 100%;
}

С использованием position: absolute, iframe будет располагаться как можно ближе к левому краю окна ble (спасибо left: 0). Затем мы используем width: 100%, чтобы заполнить страницу.

Вам также следует рассмотреть возможность добавления класса или идентификатора в iframe, чтобы вы могли использовать его для стилизации вместо элемента <iframe>, просто в Если на одной странице окажется несколько фреймов iframe.

...