イメージ表示ボックスのマージン・パディングを調整
1.フロート設定の要素 width を設定。余白・ボーダーを設定しない。
2.1.に内包された要素でmargin,padding,border等を設定。
3.フロートの後はclearを必ず指定。
div.img_box_left,div.img_box_right{
/*---------------20170109 変更---------------
width: 19em;*//*21em*//*---------------20100515 変更---------------*/
/*
margin: .5em;
*/
margin:.5em .5em.5em.5em;
padding: .5em .5em.5em.5em;
border: dotted #999999;
border-width: 1px;
color: #000000;
background-color: #fffafa;
}
2017-01-09
2013-02-17
default_2007_00.css,default_2010_00.cssの変更
イメージ表示の領域がデジカメに適合していませんでした。
.img43{/*horizontal_360px_270px*/
width : 25.714285714285714em;
height : 19.285714285714286em;
}
.img34{/*vertical_270px_360px*/
width : 19.285714285714286em;
height : 25.714285714285714em;
}
を追加
.img43{/*horizontal_360px_270px*/
width : 25.714285714285714em;
height : 19.285714285714286em;
}
.img34{/*vertical_270px_360px*/
width : 19.285714285714286em;
height : 25.714285714285714em;
}
を追加
2012-07-29
default_2007_00.css の変更
川のできごと20XX の日付と場所のマージン調整。
Firefoxではうまく行きますが
IE8ではうまくいきません
.ml2{
margin-left: 2.5em;/*2->2.5 2012.07.28変更*/
}
2012-05-13
default_2007_diary.cssの変更
default_2007_diary.cssを次のように変更
#diary_content .bar3{
width: 10em;
padding-left : 7.5em;
text-indent : -7em;
}
を追加しました。
2011-05-09
2010-05-26
CSSの変更
今まで使用してきた
default_2007_00.css
と
default_2007_ggiwfish.css
を
default_2010_00.css
と
default_2010_ggiwfish.css
に変更し一部に適用
xhtmlを整理
公開当初から本文インデントのために使用していた
<div id="layer1" class="article_01">
を
<!--div id="layer1" class="article_01--">
、と使用中止し
< div id="main_contents">
に
/*html > body */#main_contents p{
font-size: 100%;
text-indent: 1em;
line-height: 1.5em;
}
/*html > body */#main_contents br{
clear: both;
}
を適用する。
また、
本文中イメージ表示領域に
div.img_box_left{
clear : both;
float: left;
}
div.img_box_right{
clear : both;
float: right;
}
使用した後表示が乱れるためクリアーする
.float_clear{
clear : both;
}
を
< br class="float_clear" / >
として、クリアーしていたものを
#main_contents br{
clear: both;
}
、としてファイルサイズの減量と、入力の省力を図る。
default_2007_00.css
と
default_2007_ggiwfish.css
を
default_2010_00.css
と
default_2010_ggiwfish.css
に変更し一部に適用
xhtmlを整理
公開当初から本文インデントのために使用していた
<div id="layer1" class="article_01">
を
<!--div id="layer1" class="article_01--">
、と使用中止し
< div id="main_contents">
に
/*html > body */#main_contents p{
font-size: 100%;
text-indent: 1em;
line-height: 1.5em;
}
/*html > body */#main_contents br{
clear: both;
}
を適用する。
また、
本文中イメージ表示領域に
div.img_box_left{
clear : both;
float: left;
}
div.img_box_right{
clear : both;
float: right;
}
使用した後表示が乱れるためクリアーする
.float_clear{
clear : both;
}
を
< br class="float_clear" / >
として、クリアーしていたものを
#main_contents br{
clear: both;
}
、としてファイルサイズの減量と、入力の省力を図る。
登録:
投稿 (Atom)