Re: nada icons のスマホ表示時のメニューに罫線を入れたい

トップ > WEBサイト制作 > nada icons のスマホ表示時のメニューに罫線を入れたい

BLUES > nada icons のスマホ表示時のメニューに罫線を入れたい @ 2016/1/9 13:24
» katokaisya > Re: nada icons のスマホ表示時のメニューに罫線を入れたい @ 2016/3/24 10:46

katokaisya > Re: nada icons のスマホ表示時のメニューに罫線を入れたい @ 2016/3/24 10:46
はじめまして。katoともうします。 app/webroot/theme/nada-icons/css/smartphone/style.css の１０行目付近の `.global-menu li a{ display:block; width:106px; padding:6px 0; color: #FFFFFF; text-decoration: none; line-height: 1.2em; }` を `.global-menu li a{ display:block; width:105px; height: 51px; padding:6px 0; color: #FFFFFF; text-decoration: none; line-height: 1.2em; border-right: solid 1px #fff; border-bottom: solid 1px #fff; }` に書き換えれば、白い罫線が入れられます。 ※縦幅と横幅の関係で、普通にborder指定するとおかしくなるので、aタグの横幅をマイナス１ｐｘして、高さを固定し、右側と下側だけにborderを入れています。

katokaisya > Re: nada icons のスマホ表示時のメニューに罫線を入れたい @ 2016/3/24 10:46

はじめまして。katoともうします。
app/webroot/theme/nada-icons/css/smartphone/style.css
の
１０行目付近の

.global-menu li a{
	display:block;
	width:106px;
	padding:6px 0;
	color: #FFFFFF;
	text-decoration: none;
	line-height: 1.2em;
}

を

.global-menu li a{
	display:block;
	width:105px;
	height: 51px;
	padding:6px 0;
	color: #FFFFFF;
	text-decoration: none;
	line-height: 1.2em;
	border-right: solid 1px #fff;
	border-bottom:  solid 1px #fff;
}

に書き換えれば、白い罫線が入れられます。
※縦幅と横幅の関係で、普通にborder指定するとおかしくなるので、aタグの横幅をマイナス１ｐｘして、高さを固定し、右側と下側だけにborderを入れています。

フラット表示

前のトピック | 次のトピック

Re: nada icons のスマホ表示時のメニューに罫線を入れたい

キーワード検索