■ユーザーズフォーラム リニューアルのお知らせ
新規投稿は新ユーザーズフォーラムにお願いします。
このフォーラムは閲覧専用のアーカイブです。

nada-iconsのtopページのバナーについて

jun > nada-iconsのtopページのバナーについて @ 2014/8/7 1:23
お世話になります。
現在、nada-iconsのテーマを利用してHPを作成しております。

トップページの中段あたりの2列並んでいるバナーの下に同じバナーを設置しました。

変更したのは、Elements内のtoppage.phpの中身です。

変更前
<div id="top-contents" >
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>



変更後
<div id="top-contents" >
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>
<div id="top-contents" >
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>


表示自体は問題なく表示されましたが、2段にしたために
レイアウトの崩れが生じ、フッター部分が短く表示されるようになってしまいました。

CSSを見直すべきだと思うのですが、どこの部分の変更が必要なのか
知識がない為、試行錯誤しております。

宜しければアドバイスを頂けると助かります。
宜しくお願い致します。


■ BaserCMSのバージョン:3.0.2
■ レンタルサーバー名:lolipop
■ スマートURLの利用: OFF
■ 利用しているデータベース:MySQL
■ PHPスキル(自己評価):E
nakamura > Re: nada-iconsのtopページのバナーについて @ 2014/8/25 17:15
junさん、こんにちは!

変更後のコードを試してみました。

<div id="top-contents" >

このdivの終了タグがないようです。




参考までに
バナーの設置のやり方としては2つありそうです。
よろしかったらお試しください。
junさんのお力になれていると嬉しいです(^^)

[1]

<div id="top-contents" >
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>
</div><!-- top-contents -->




[2]

<div id="top-contents" >
	<div id="top-contents-main">
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
		<div id="top-bnr">
			<div id="top-bnr-left">
				<?php $this->BcBaser->img('./icons_banner_l_01.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
			<div id="top-bnr-right">
				<?php $this->BcBaser->img('./icons_banner_l_02.png', array('url' => '/#')); ?>
				<p>紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります紹介文が入ります</p>
			</div>
		</div>
	</div>
</div><!-- top-contents -->