X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.4.x%2Ftest%2Fcomic-html-structure.html;h=d7a30bf14e2cfec27da20bd6595ee459334d1971;hb=df4575c24267b984d159fa0e69a60831d18bdc8d;hp=c25ca5794880efdb335bbb1682d293b8d4bb69f6;hpb=fbc8e8aa4dc1607d4b8812dd8e923bc22b50e723;p=pettanr%2FclientJs.git

diff --git a/0.4.x/test/comic-html-structure.html b/0.4.x/test/comic-html-structure.html
index c25ca57..d7a30bf 100644
--- a/0.4.x/test/comic-html-structure.html
+++ b/0.4.x/test/comic-html-structure.html
@@ -9,7 +9,7 @@
 	<meta http-equiv="imagetoolbar" content="no">
 	<link rel="stylesheet" type="text/css" href="../stylesheets/common.css">
 	<!-- InstanceBeginEditable name="doctitle" -->
-	<title>Comic 用 html構造テスト | pettanR</title>
+	<title>マンガ状コンテンツを表示するための html + css の調査 | pettanR</title>
 	<!-- InstanceEndEditable -->
 	<!-- InstanceBeginEditable name="head" -->
 	<style type="text/css">
@@ -54,6 +54,7 @@
 				margin:				0 !important;
 				vertical-align:		middle;
 				text-align:			center;
+				font-size:			14px; /* opera6で仕様 13px は不可 */
 			}
 			
 			
@@ -82,7 +83,7 @@
 			}
 			.test2-pettanr-comic-balloon div {
 				position:				relative;
-				display:				table;
+				display:				table-row;
 				padding:				0 16.6%;
 				width:					66.6%;
 				height:					100%;
@@ -101,6 +102,7 @@
 						zoom:					1;
 						*position:				relative;
 						*top:					-50%;
+						font-size:				14px;
 					}		
 /*  PettanR Comic
 --------------------------------------------------------------------------------------*/
@@ -136,7 +138,8 @@
 				width:					66.6%;
 				height:					100%;
 				*height:				auto;
-				*top:					50% !important;				
+				*top:					50% !important;
+				border:					1px solid red;				
 			}	
 				.test3-pettanr-comic-balloon p span {
 					display:				table-cell;
@@ -145,7 +148,9 @@
 					*display:				block;
 					zoom:					1;
 					*position:				relative;
-					*top:					-50%;					
+					*top:					-50%;
+					font-size:				14px; /* opera6で仕様 13px は不可 */
+					border:					1px solid blue;		
 				}	
 	</style>
 	<!-- InstanceEndEditable -->
@@ -168,7 +173,7 @@
             <div id="inner-wrapper" class="base-content-width">
 				<!-- InstanceBeginEditable name="main_content" -->
 				<div id="main">
-					<div id="breadcrumb"><a href="index.html">テスト インデックス</a> &gt; コミック用 html 構造のテスト</div>
+					<div id="breadcrumb"><a href="index.html">テスト インデックス</a> &gt; マンガ状コンテンツを表示するための html + css の調査</div>
 					<h2>マンガ状コンテンツを表示するための html + css の調査</h2>
 					<p>html 4.01 + css 2.1 で pettanR コミックを表示するための html 構造のテストページです．</p>
 					<p>ぺったんR 仕様の html によるコミック状表示が可能なブラウザはどれか？このページを表示させつつ判断します．</p>
@@ -190,7 +195,11 @@
 						</div>
 					</div>
 					<h3>対応ブラウザ</h3>
-					<p>NN9, firefox 3.6, ie5.5, ie6, ie7, Iron5, Opera10, opera8</p>
+					<p>NN7, NN8, NN9, firefox 3.6, ie5.5, ie6, ie7, Iron5, Opera10, opera8, opera7</p>
+					<h3>準対応ブラウザ</h3>
+					<p>opera6( overflow:hiddenが利かず要素がパネルをはみ出す ), Konqueror4.8(windows, さて？がずれる)</p>
+					<h3>非対応ブラウザ</h3>
+					<p>NN6(テキスト表示位置がずれる), opera5(　日本語に非対応で文字化けする )</p>
 					<h3>source</h3>
 					<h4>html 部分</h4>
 					<p>パネルピクチャはひとつの &lt;img&gt; タグで表示されます．</p>
@@ -252,6 +261,7 @@
 
 					<h2>css:table-cell を使ったテキストの上下中央配置 及びクロスブラウザ対応 タグの少ないバージョン</h2>
 					<p>html タグ構造は 先の &lt;table&gt; レイアウトに比べて自然．しかし <code>display:table-cell</code> などを使うため、より広範なブラウザに対応する、という点で不安が残る．</p>
+					<p>参考にしたページ <a href="http://scuderia-web.com/tips/xhtml_css/div_vertical_align.php" target="_blank">tableを使わずdivで縦位置を指定</a></p>
 					<div class="test3-pettanr-comic-wrapper" style="width: 400px;">
 						<div class="test3-pettanr-comic-panel" style="border-width: 2px; height: 235px;">
 							<img src="../resource_pictures/1.png" width="166" height="252" style="left: 178px; top: -2px; z-index: 0;">
@@ -266,7 +276,11 @@
 						</div>
 					</div>					
 					<h3>対応ブラウザ</h3>
-					<p>NN9, firefox 3.6, ie5.5, ie6, ie7, Iron5, Opera10, opera8</p>
+					<p>NN7, NN8, NN9, firefox 3.6, ie5.5, ie6, ie7, Iron5, Opera10, opera8, opera7, Konqueror4.8(windows)</p>
+					<h3>準対応ブラウザ</h3>
+					<p>opera6( overflow:hiddenが利かず要素がパネルをはみ出す )</p>
+					<h3>非対応ブラウザ</h3>
+					<p>NN6(テキスト表示位置がずれる), opera5(　日本語に非対応で文字化けする )</p>
 					<h3>source</h3>
 					<h4>html 部分</h4>
 					<p>パネルピクチャはひとつの &lt;img&gt; タグで表示されます．</p>
@@ -417,6 +431,9 @@
             <div id="copyright">Copyright (c) 2011-2012 pettanR team, some rights reserved.</div>
         </div><!-- #EndLibraryItem -->
 	</div>
+	<script type="text/javascript">
+		var has_server_support = false;
+	</script>
 	<script type="text/javascript" src="../javascripts/common.js"></script>
 <!-- InstanceBeginEditable name="script" -->
 <!-- InstanceEndEditable -->