Я получил этот сайт здесь http://inauguralseason.com/, и если вы нажмете на контакт с нами в IE 8, страница открывается в floatbox, проблема в том, что floatbox занимает весь экран, а контактная форма должна быть центрирована. .. у кого-нибудь есть идеи, почему он это делает?Wordpress floatbox issue IE
Я полагаю, что ваш вопрос «почему контактная форма не . по центру», а не„почему floatbox занимает весь экран“
Ваше содержание floatbox является iframe источником которого является http://inauguralseason.com/?page_id=12
форма содержится в div с классом contactBackground, этот класс определяется в файле style.css и имеет свойство margin: auto, которое должно быть сосредоточено на нем.
К сожалению, как вы можете прочитать here, этот метод не работает в режиме IE8 quirks; этот режим не поддерживается floatbox, как указано на instructions.
Решение просто добавляет объявление DOCTYPE в начале страницы.
Глядя на исходный код floatbox iframe, я также заметил, что теги <html>10 и <body> отсутствуют, поэтому вы также должны добавить эти теги.
Полученный HTML-код должен быть так:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
body{
background-image: url('http://inauguralseason.com/wp-content/themes/twentyeleven/images/repeating_bq_pink.gif') !important;
}
</style>
<link rel="stylesheet" type="text/css" media="all" href="http://inauguralseason.com/wp-content/themes/twentyeleven/style.css" />
</head>
<body>
<div id="main" style="padding-top:11px;">
<article id="post-12" style="padding:0!mportant; margin:0!important; width:595px; height:600px;" class="post-12 page type-page status-publish hentry">
<header class="entry-header">
<!--<h1 class="entry-title"></h1>-->
</header><!-- .entry-header -->
<div class="contactBackground">
<div class="wpcf7" id="wpcf7-f17-p12-o1">
<form action="/?page_id=12#wpcf7-f17-p12-o1" method="post" class="wpcf7-form">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="17" />
<input type="hidden" name="_wpcf7_version" value="3.2.1" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f17-p12-o1" />
<input type="hidden" name="_wpnonce" value="1050e77acd" />
</div>
<p>
Your Name (required)<br />
<span class="wpcf7-form-control-wrap your-name">
<input type="text" name="your-name" value="" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" size="40" />
</span>
</p>
<p>
Your Email (required)<br />
<span class="wpcf7-form-control-wrap your-email">
<input type="text" name="your-email" value="" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" size="40" />
</span>
</p>
<p>
Subject<br />
<span class="wpcf7-form-control-wrap your-subject">
<input type="text" name="your-subject" value="" class="wpcf7-form-control wpcf7-text" size="40" />
</span>
</p>
<p>
Your Message<br />
<span class="wpcf7-form-control-wrap your-message">
<textarea name="your-message" class="wpcf7-form-control wpcf7-textarea" cols="40" rows="10"></textarea>
</span>
</p>
<p>
Please Enter The Text Below<br />
<span class="wpcf7-form-control-wrap captcha-715">
<input type="text" name="captcha-715" value="" class="wpcf7-form-control wpcf7-captchar" size="40" />
</span>
</p>
<p>
<input type="hidden" name="_wpcf7_captcha_challenge_captcha-715" value="1614713562" /><img alt="captcha" src="http://inauguralseason.com/wp-content/uploads/wpcf7_captcha/1614713562.png" class="wpcf7-form-control wpcf7-captchac wpcf7-captcha-captcha-715" width="84" height="28" />
</p>
<p>
<input type="submit" value="Send" class="wpcf7-form-control wpcf7-submit" />
</p>
<div class="wpcf7-response-output wpcf7-display-none"></div>
</form>
</div>
</div>
<footer class="entry-meta"></footer><!-- .entry-meta -->
</article><!-- #post-12 -->
</div>
</body>
</html>
UPDATE:
Проблема ширина floatbox зависит от стиля Iframe, определенной в строке 1535 в файле "style.css":
/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
max-width: 100%;
}
Я не использовал floatbox раньше, но я предположил бы, что это будет иметь дополнительные опции, такие как настройка высоты и/или ширины модального, которое появляется контактная форма.
Источник страницы имеет несколько HTML-элементов: S Само по себе флоат-бокс является телом одного из этих экземпляров. Ну, есть твоя проблема. Я собираюсь опасаться, что вы используете какой-то плагин, который должен просто вытащить контейнер с плавающей точкой, но вместо этого захватывает весь документ.
Не очень много вы можете сделать (или хотите сделать), прежде чем исправить проблему с тегами HTML. После этого, должно быть довольно прямолинейно нацелить контейнер и отрегулировать размер/интервал: #container {width: Xpx; высота: Ypx; заполнение: Zpx; (И т.д., и т.д.}, которые вы можете сделать в WordPress через стили пользователей переопределить, если вы знаете размеры вам нужно.
Надеется, что это помогает.
он получил его по центру, но не для ширины – user1269625
его еще Tak весь экран – user1269625