私は現在divをラップしていない別のdivの下部に貼り付けるように移動します。div以外のdivを別のdivの末尾に貼り付けるには
私はワードプレスエディタDiviというテーマを使用しています。クライアントは実際のDiviエディタにある別のdivの下にメニューを置いていますが、メニューはHTMLとPHPの組み合わせで生成されます
<div id="top-header"<?php echo $et_top_info_defined ? '' : 'style="display: none;"'; ?>>
<div class="container clearfix">
<?php if ($et_contact_info_defined) : ?>
<div id="et-info">
<?php if ('' !== ($et_phone_number = et_get_option('phone_number'))) : ?>
<span id="et-info-phone"><?php echo et_sanitize_html_input_text($et_phone_number); ?></span>
<?php endif; ?>
<?php if ('' !== ($et_email = et_get_option('header_email'))) : ?>
<a href="<?php echo esc_attr('mailto:' . $et_email); ?>"><span id="et-info-email"><?php echo esc_html($et_email); ?></span></a>
<?php endif; ?>
<?php
if (true === $show_header_social_icons) {
get_template_part('includes/social_icons', 'header');
} ?>
</div> <!-- #et-info -->
<?php endif; // true === $et_contact_info_defined ?>
<div id="et-secondary-menu">
<?php
if (! $et_contact_info_defined && true === $show_header_social_icons) {
get_template_part('includes/social_icons', 'header');
} else if ($et_contact_info_defined && true === $show_header_social_icons) {
ob_start();
get_template_part('includes/social_icons', 'header');
$duplicate_social_icons = ob_get_contents();
ob_end_clean();
printf(
'<div class="et_duplicate_social_icons">
%1$s
</div>',
$duplicate_social_icons
);
}
if ('' !== $et_secondary_nav) {
echo $et_secondary_nav;
}
et_show_cart_total();
?>
</div> <!-- #et-secondary-menu -->
</div> <!-- .container -->
</div> <!-- #top-header -->
<?php endif; // true ==== $et_top_info_defined ?>
それが効果的に最も簡単な解決策になるように私は、コードモジュールに上記のコードを挿入しようとしましたが、それは結局のところ、それがPHPをサポートしていません。 :(コンテンツにphpを有効にする安全な方法がある場合は、別の実行可能な解決方法です)
これはposition:absoluteとtop:numberで簡単に行えますが、これは応答せず、いくつかのメディアクエリ
幸いなことに、クライアントはアンカーdivの下のdivをオーバーラップさせたいので、高さを考慮する必要はありません
異なるトップ値を持つ複数のメディアクエリよりもクリーンで簡単な方法があるかどうかをご確認したいと思います。
理想的には、ソリューションは純粋なCSSです。
ありがとうございます!