phpでliを5個呼び出すとＩＥ７で6個呼び出されてしまう問題

解決済 tkj_tkj
(@tkj_tkj)

11年、 11ヶ月前
表題の件なのですが
phpでリストを5個呼び出す記述をしているのですが
ＩＥ７のブラウザではＩＥＴＥＳＴＥＲでソースを見ると

<li></li>
という記述が先頭に現れてしまい、

<li></li>
が計６個呼び出されてしまい、
最初のliの分だけ空白が生まれてしまいます。

ちなみにＩＥ８でも

<li></li>
という記述が先頭に現れていますが
空白は生まれておりません。

ｐｈｐの記述は以下です。
カスタム投稿を使って最新ニュースを５個まで呼び出す記述になります。

<div id=”news”>
- <?php $myposts = get_posts(array(
  ‘post_type’ => array( ‘post’,’post2′,’post3′,’post4′),
  ‘posts_per_page’ => 5,
  )); ?>
  <?php foreach($myposts as $post) :setup_postdata($post);?><?php get_template_part(‘content’,’title’); ?>
  <?php endforeach; ?>
</div>

ご質問１：ブラウザによって呼び出される内容が異なる、ということがあるのでしょうか？

ご質問２：これはワードプレスやＰＨＰの問題ではなく、ＩＥ７に対するバグ対策の話なのでしょうか？

ワードプレスに関する内容でなかった場合は申し訳ございません。

6件の返信を表示中 - 1 - 6件目 (全6件中)

トピック投稿者 tkj_tkj
(@tkj_tkj)

11年、 11ヶ月前

参考までに
content-title.phpの記述は以下

<li class=”news_list”><div class=”new_gif”><?php
$days = 7; //Newを表示させたい期間の日数
$today = date_i18n(‘U’);
$entry = get_the_time(‘U’);
$kiji = date(‘U’,($today – $entry)) / 20000 ;
if( $days > $kiji ){
echo ‘<img src=”http://example.com.gif”/>’;
}
?></div><div class=”date”><?php echo get_the_date(); ?></div><div class=”title”>“><?php the_title(); ?></div>

各ＣＳＳは

#news{width:380px; height:145px; float:right; margin-right:32px;}
.new_gif { width:30px; float:left; padding-top:10px; margin-left:8px; }
.date { width:100px; font-size:12px; line-height:14.4px; font-family:”ヒラギノ角ゴ Pro W3″, sans-serif; float:left;padding-top:9px; margin-left:5px;}
.title { width:219px; color:#5193e2; font-size:12px; line-height:14.4px; font-family:”ヒラギノ角ゴ Pro W3″, sans-serif; padding-top:9px; float:right; margin-right:8px;}
.news_list { border-bottom:dotted 1px #cacaca; height:28.5px; }

になります。

IE７以上をターゲットブラウザにしております。

kz
(@kz)

11年、 11ヶ月前

content-title.php に </li> が無いです。

トピック投稿者 tkj_tkj
(@tkj_tkj)

11年、 11ヶ月前

大変申し訳ございません、
こちらへ転記する際にliが抜けてしまっておりました。

実際にはcontent-title.phpは以下のような記述になっております。
大変失礼致しました。

<li class=”news_list”><div class=”new_gif”><?php
$days = 7; //Newを表示させたい期間の日数
$today = date_i18n(‘U’);
$entry = get_the_time(‘U’);
$kiji = date(‘U’,($today – $entry)) / 20000 ;
if( $days > $kiji ){
echo ‘<img src=”http://example.com.gif”/>’;
}
?></div><div class=”date”><?php echo get_the_date(); ?></div><div class=”title”>”><?php the_title(); ?></div>

そうやら色々調べておりましたら
ＩＥ７の特有のul liに対して起こるバグで
ＩＥ７にのみＣＳＳを適用させる記述（*:first-child+html）をすればうまくいく可能性があるようです。
※色々と思考錯誤しておりますが、まだうまくいきませんが・・・

ひょっとするとwordpressの関係ないご質問になる可能性がございます。

いずれにせよ、kz様　ありがとうございます！

トピック投稿者 tkj_tkj
(@tkj_tkj)

11年、 11ヶ月前

なぜでしょう、上記投稿のcontent-title.phpの最後に</li>を入れても表示されません・・・
そんなことあるのでしょうか？

kz
(@kz)

11年、 11ヶ月前

やっぱり </li> が無い気がします。。。
当該の URL をお知らせいただくと話が早いです◎

トピック投稿者 tkj_tkj
(@tkj_tkj)

11年、 11ヶ月前

kz様

何度もありがとうございました！

今回、
上記ご質問をさせて戴いた投稿の中になぜか<li>が表示されていないのですが、

実際に私のコードを見直しますと
content-title.phpの中にも外にも<li>を設置しており、
結果、

`
<ul>
<li>
<li class=”news_list”><div class=”new_gif”><?php
$days = 7; //Newを表示させたい期間の日数
$today = date_i18n(‘U’);
$entry = get_the_time(‘U’);
$kiji = date(‘U’,($today – $entry)) / 20000 ;
if( $days > $kiji ){
echo ‘<img src=”http://example.com.gif”/>’;
}
?></div><div class=”date”><?php echo get_the_date(); ?></div><div class=”title”>”><?php the_title(); ?></div>
</li>
</li>
</ul>
`

と<li>が重なっていることが原因のようで、
修正が完了致しました。

大変失礼致しました。

6件の返信を表示中 - 1 - 6件目 (全6件中)

トピック「phpでliを5個呼び出すとＩＥ７で6個呼び出されてしまう問題」には新たに返信することはできません。