プレート画像にテキストを記入したい

Question

プレート画像があります。
そのプレート画像にテキストを入力したいです。

<div id="box">
<img src="template1.jpg" width="150" height="50">
<!--#boxtextを入力-->
<div id="boxtext">
<p>Welcome to Tokyo Hill </p>
</div>
</div>

#box {
  margin-left:auto;
  margin-right:auto;
  position: relative;
  top: 290px;
}

#boxtext{
  position:absolute;
  top:100px;
  left:100px;
}

また、文字が記載されたこのプレート画像を画面の真ん中の位置まで持っていきたいのですが、どのように書けばいいのかご教授ください。

どうぞよろしくお願いいたします。

Answer 1

別の質問と統一します。

Answer 2

<div id="box"> <img src="template1.jpg" width="150" height="50"> <!--#boxtextは#boxの中に配置してください。--> <div id="boxtext"> <p>Welcome to tokyo hill </p> </div> </div>

#box {
margin-left:auto;/左右のマージンをautoに指定すると#boxが画面中央に表示されます。/
margin-right:auto;
margin-top:290px;/top:290px;の替わり。left: 433px;は真ん中表示には邪魔なので削除/
position: relative;
border:1px solid#000;
box-shadow:0px 0px 10px;
}

#boxtext{
position:absolute;
top:100px;/テキストの上からの位置です。お好きな値をどうぞ/
left:100px;/テキストの左からの位置です。お好きな値をどうぞ/
}

どうでしょう？

Comments

[tomo39-.]

回答ありがとうございます。
いただいたコードを記入したのですが、画面には反映されません。
何故でしょうか？再度コードを記入しますので、ご確認いただけますでしょうか？

[Samson818]

FTPを使用して、ソースをアップ。ブラウザで確認しているという感じでしょうか？

コードを記入した後、セーブしましたか？
正しいhtml、cssをアップロードしましたか？
正しい場所にアプロードしましたか？
ブラウザのリロードはctrl+F5でスーパーリロードしてますか？

画面に反映されない理由は以上のようなものが考えられます。
コードの問題とは別かも^^;

[tomo39-.]

はい。FTPを使用してソースをアップしています。
ご丁寧にありがとうございます。只今確認します。
別の質問にも回答をいただいているので、そちらより返答します。

[date]

ShimpeiFubasamiさん
```
でプログラムを囲んでいないせいで#でマークダウンが効いてしまい#が抜けています。
```
でCSSを囲んであげてください