iPadのみで作ったホームページファイルをアップしたいです。

Question

###前提・実現したいこと
iPadでtextastic を使って、HTMLの簡単なウェブページを作っています。
サーバーもドメインも取得して、textastic でFTP変換もできたはずなのですが、http://kotenbunnpo.html.xdomain.jp/ で飛んでみてもエラーになります。また、textastic でFTPのページに飛んでもコネクトを拒否されてしまいました。
また、cssが実装されていません。
textastic のローカルホストではできているのですが、これからどう進めばいいのでしょうか？

###発生している問題・エラーメッセージ

エラーメッセージ

###該当のソースコード

ここにご自身が実行したソースコードを書いてください

###試したこと
課題に対してアプローチしたことを記載してください

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報

Answer 1

お騒がせしました。トップページのファイル名をindex.htmlに変えたら解決できました。回答していただきありがとうございました。

Answer 2

http://kotenbunnpo.html.xdomain.jp/ というURLから推測してお話しします。
Xドメインの無料レンタルサーバーをお使いだと思われるのですが、お間違いないでしょうか。

そうでしたら、こちらからまずログインを行ってみてください。
https://www.xdomain.ne.jp/login/member.php

ログインしたら、画面左のメニューから「無料レンタルサーバー」を選択してください。
その次の画面で、「HTMLサーバー 利用中」となっていると思うので、をクリックします。

次の画面で、画面右のほうにある「FTPアカウント設定」をクリックし、
その次の画面で「WebFTP」の下の「ログイン」をクリックするとファイルマネージャーにログインします。

最後に、アップロードをクリックし、アップロードしたいファイルを選択すれば良いです。

Webページ作成、頑張ってください。

Comments

[yukidaru55]

すごい。ドメイン名からもわかってしまうんですね。
すみません。ファイルマネージャーからもアップロードしてみましたが、cssが実装できなくなってしまいます。

[退会済みユーザー]

cssが実装できない状況は再現できませんでした。すみません。
解決して何よりです。今後も頑張ってください。

いくつか提案があるのですが、まず、上の空白を消した方が見栄えが良いと思います。
このために、以下のcssを追加することをお勧めします。
body {
margin: 0;
}
これは、bodyタグにデフォルトで入ってしまうmarginという空白部分を削除するcssです。

また、.mainの幅指定は以下のように行った方がよいと思います。
.main {
(略)
width: calc(100vh - 200px);
(略)
}
calc()というのは、計算を行ってくれるcssの関数です。この場合、100vh(画面の表示できる領域の幅)からpaddingに指定されている100pxが左右で2つ分の200pxを引いています。こうすることで、横にスクロールしてしまう可能性を最小限にすることができます。

是非ご検討ください。