C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[4]: 表示位置について


(過去ログ 125 を表示中)

[トピック内 5 記事 (1 - 5 表示)]  << 0 >>

■74617 / inTopicNo.1)  表示位置について
  
□投稿者/ 鏡月 (4回)-(2015/01/13(Tue) 20:20:23)

分類:[HTML/CSS] 

お世話になっております。

HTMLを勉強中の鏡月と申します。

HTMLの表示位置がうまくいかない為、どなたかご教授下さい。
※IE11で表示確認をしております。

下記のコードでテーブルの中にボックスを使用している箇所とボックスを使用していない箇所があります。
ボックスを使用している箇所のボタンや文字の位置をテストAの箇所の用にテーブルの中央に配置したいのですが可能でしょうか。

<table style="width: 274px; border: 2px black solid;">
<tr>
<td style="214px;">
<div>
<div style="float:left; width:60px; height:30px; "><input type="submit" name="test" value="テスト" id="test" style="width: 60px;" /></div>
<div style="float:left; width:67px; height:30px;"></div>
<div style="float:left; width:67px; height:30px; vertical-align:middle;"><span>テスト@</span></div>
</div>
</td>
<td>
<span>テストA</span>
</td>
</tr>
</table>

引用返信 編集キー/
■74618 / inTopicNo.2)  Re[1]: 表示位置について
□投稿者/ WebSurfer (474回)-(2015/01/13(Tue) 22:17:44)
No74617 (鏡月 さん) に返信

> 下記のコードでテーブルの中にボックスを使用している箇所とボックスを使用していない箇所があります。
> ボックスを使用している箇所のボタンや文字の位置をテストAの箇所の用にテーブルの中央に配置したいのですが可能でしょうか。

「ボックス」というのは何でしょうか?
引用返信 編集キー/
■74621 / inTopicNo.3)  Re[2]: 表示位置について
□投稿者/ 鏡月 (5回)-(2015/01/14(Wed) 09:18:58)
No74618 (WebSurfer さん) に返信
> 「ボックス」というのは何でしょうか?
→HTMLの中に箱みたいなものを作成することだと思われます。
参照URL:http://www.htmq.com/csskihon/301.shtml

<div>
<div style="float:left; width:60px; height:30px; "><input type="submit" name="test" value="テスト" id="test" style="width: 60px;" /></div>
<div style="float:left; width:67px; height:30px;"></div>
<div style="float:left; width:67px; height:30px; vertical-align:middle;"><span>テスト@</span></div>
</div>

上記のコードでボタンの指定している位置からある程度スペースを空けるために使用し、テスト@と言う文字を表示したいと思っております。
[テスト(ボタン)][ボックスによるスペース][テスト@]みたいに表示したいと思っております。

私が言っているボックスの名称が違った場合申し訳ございません。
引用返信 編集キー/
■74623 / inTopicNo.4)  Re[3]: 表示位置について
□投稿者/ WebSurfer (475回)-(2015/01/14(Wed) 13:44:12)
No74621 (鏡月 さん) に返信

> 上記のコードでボタンの指定している位置からある程度スペースを空けるために使用し、テスト@と言う文字を表示したいと思っております。
> [テスト(ボタン)][ボックスによるスペース][テスト@]みたいに表示したいと思っております。

「スペースを空ける」のが目的であれば div 要素を使わないで、td 要素を使って
以下のようにしては以下がですか?

<table style="width: 274px; border: 2px black solid;">
    <tr>
        <td style="width:60px;">
            <input type="submit" name="test" value="テスト" id="Submit1" />            
        </td>
        <td style="width:67px;">
        </td>
        <td style="width:67px;">
            <span>テスト@</span>
        </td>
        <td>
            <span>テストA</span>
        </td>
    </tr>
</table>

引用返信 編集キー/
■74624 / inTopicNo.5)  Re[4]: 表示位置について
□投稿者/ 鏡月 (6回)-(2015/01/14(Wed) 15:00:40)
No74623 (WebSurfer さん) に返信
> 「スペースを空ける」のが目的であれば div 要素を使わないで、td 要素を使って
> 以下のようにしては以下がですか?
>
> <table style="width: 274px; border: 2px black solid;">
> <tr>
> <td style="width:60px;">
> <input type="submit" name="test" value="テスト" id="Submit1" />
> </td>
> <td style="width:67px;">
> </td>
> <td style="width:67px;">
> <span>テスト@</span>
> </td>
> <td>
> <span>テストA</span>
> </td>
> </tr>
> </table>
→Tableの存在を忘れておりました…
 無事に表示したい位置に調整することが出来ました。
 
 ありがとうございました。
解決済み
引用返信 編集キー/


トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

管理者用

- Child Tree -