質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

文字コード

文字コードとは、文字や記号をコンピュータ上で使用するために用いられるバイト表現を指します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

1955閲覧

スクロールバー内の文字が横書きではなく縦書きになる

Akki-ra

総合スコア5

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

文字コード

文字コードとは、文字や記号をコンピュータ上で使用するために用いられるバイト表現を指します。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/10/01 11:12

前提・実現したいこと

利用規約のスクロールバー内の文字を横書きにしたい
イメージ説明

該当のソースコード

signup_form.php

<?php session_start(); // CSRF対策 setToken()を呼び出しのため require_once '../functions.php'; // ログインしているにもかかわらず表示される(リダイレクトする) require_once '../classes/UserLogic.php'; // ログインしていたらtrue $result = UserLogic::checkLogin(); if($result) { header('Location: mypage.php'); return; } // ユーザを登録してログインしてください! $login_err = isset($_SESSION['login_err']) ? $_SESSION['login_err'] : null; unset($_SESSION['login_err']); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style.css"> <title>ユーザ登録画面</title> <style> #wrapper {height: 400px; width: 600px; overflow-x: hidden; overflow-y: visible;} </style> </head> <body> <!-- ヘッダー --> <header> <h2><a href="index.php">知りたいコミュニティー</a></h2> </header> <!-- ヘッダーより下 --> <div> <!-- 左サイドバー --> <nav> <ul> <li><a href="index.php">TOP</a></li> <li><a href="signup_form.php">新規登録</a></li> <li><a href="login_form.php">ログイン</a></li> </ul> </nav> <!-- 右サイド --> <aside> <div id="pic"> <img src="../images/pic.jpg" alt=""> <p>知りたいコミュニティーです。</p> </div> <main> <h3>新しく日記を作成する</h3> <?php if (isset($login_err)) : ?> <p><?php echo $login_err; ?></p> <?php endif; ?> <form action="register.php" method="POST"> <p><label for="username">1.ユーザ名:</label></p> <p>blogを利用するには、ユーザーIDが必要になります。</p> <p><input type="text" name="username"></p> <p><label for="email">2.メールアドレス:</label></p> <p><input type="email" name="email"></p> <p><label for="password">3.パスワード:</label></p> <p>パスワードを入力して下さい:</p> <p><input type="password" name="password"></p> <p>再度パスワードを入力してください:</p> <p><input type="password" name="password_conf"></p> <p>4.利用規約</p> <p>利用規約に同意の上、ご利用ください。</p> <div id="wrapper"> <p> 本規約は、知りたいコミュニティーが提供するサービス「知りたいコミュニティー」を利用する個人および法人(以下、「ユーザー」)と知りたいコミュニティーとの関係を定めるものとします。また、本規約は知りたいコミュニティーの利用に関して生ずる全ての関係に適用されるものとします。 </p> <p> 第1条 知りたいコミュニティーが提供するサービスについて サービスをご利用になる場合には、インターネットにアクセスしていただく必要があります。ユーザーのみなさまには、自らの責任と費用で必要な機器やソフトウェア、通信手段等をご用意いただき、それらを適切に設置、操作いただく必要があります。知りたいコミュニティーはユーザーのみなさまがインターネットにアクセスされるための準備、方法などについては一切関与いたしておりません。 なお、知りたいコミュニティーが提供しておりますサービス中には成人向けの内容を含む場合もあります。そのようなサービスへのアクセスは18歳以上の方に限らせていただきます。 </p> <p> 第2条 登録サービスをご利用いただくにあたり ご利用にあたりユーザー登録をされる場合には次の条件をお守りください。 ユーザー登録のための書式にユーザーご自身に関する真実かつ正確なデータを入力し、知りたいコミュニティーに送信していただきます。 上記の登録データが常に真実かつ正確な内容を反映するものであるように適宜修正していただきます。 万一上記に違反した場合または真実かつ正確なデータが提供されていないと知りたいコミュニティーが判断した場合には、知りたいコミュニティーは当該ユーザーのIDを削除し、将来に渡ってサービスを利用することをお断りする権利を有しております。 </p> <p> 第3条 プライバシーの考え方 投稿者名、コメント等をインターネット等を通してサービスを閲覧している人に表示しますので、個人情報やプライバシー情報を発信する場合は十分にご留意ください。 メールアドレスならびにパスワードの管理にはご注意ください ユーザー登録されている場合、そのメールアドレスならびにパスワードの管理はユーザーのみなさまの責任において行っていただきます。メールアドレスならびにパスワードを利用して行われた行為の責任はユーザー登録を行った該当ユーザーの責任とみなします。万一、許可なくメールアドレスならびにパスワードが第三者に漏洩または利用されてしまった場合にはただちに知りたいコミュニティーにご連絡ください。また、サービスのご利用を一時的に終了される際には、その都度ログアウトをしてください。知りたいコミュニティーはメールアドレスならびにパスワードの漏洩、不正使用などから生じた損害については保証いたしません。十分にご注意ください。 </p> <p> 第4条 登録ユーザーの責務 すべてのコンテンツ(情報、データ、文書、ソフトウェア、音楽、音、写真、画像、映像、ビデオ、伝言、文字など)は、たとえその内容が公知、周知のものであったとしても、またはユーザーが個人的に取得したものであったとしても、その内容に関する権利は、それらを最初に作成した人(最初に作成した人から正当にその権利の譲渡や許諾を受けた人も含みます)に帰属するということを認識してください。ユーザーのみなさまが知りたいコミュニティーを媒体として他人に掲載、開示、提供または送付するコンテンツに関する責任は、ユーザーのみなさま自身が負います。知りたいコミュニティーはユーザーのみなさまに代わって責任を負うことは一切ございませんし、ユーザーのみなさまがサービスを媒介として他人に掲載、開示、提供または送付されるコンテンツを管理したり、その内容の信頼性、真実性、適法性を保証したりすることは一切ございません。つまり、ユーザーが、ご自身で掲載、開示、提供または送付したコンテンツに関して刑罰を受けたり、損害賠償請求をされたり、第三者から異議を申し立てられたりする可能性があるということをよくご理解いただく必要があります。知りたいコミュニティはコンテンツの内容および当該内容を使用したことに起因する損害については責任を負いません。 上記の責務を果たしていただくために、ユーザーのみなさまが以下の行為を行うことを禁止します。 </p> <p> 法令に違反するもの、他人の権利を侵害するもの、他人に経済的・精神的損害を与えるもの、脅迫的なもの、他人の名誉を毀損するもの、他人のプライバシーを侵害するもの、いやがらせ、他人を中傷するもの、猥褻・猥雑なもの、品性を欠くもの、罵詈雑言に類するもの、嫌悪感を与えるもの、民族的・人種的差別につながるもの、倫理的観点などから問題のあるものをサービスを通じて他人に掲載、開示、提供または送付すること。 未成年者を害するような行為。 自分以外の人物を名乗ったり、代表権や代理権がないにもかかわらず会社などの組織を名乗ったりまたは他の人物や組織と提携、協力関係にあると偽ったりすること。故意過失に基づき誤認した場合も含みます。(たとえば、知りたいコミュニティのスタッフを名乗ったり、他のユーザーなどになりすましたりするような行為です。) 知りたいコミュニティのサービスを通じて配信されたコンテンツの発信元を隠したり、偽装するために、ヘッダーなどの部分に手を加えること。 法律上、送信(発信)する権利を有していないコンテンツをアップロードしたり掲示したり、メールなどの方法で送信(発信)すること。 第三者の知的財産権(特許権、実用新案権、意匠権、商標権、著作権など)を侵害するようなコンテンツをアップロードしたり掲示したり、メールなどの方法で送信(発信)すること。 商業用の広告、宣伝を目的としたコンテンツ、ジャンクメール、スパムメール、チェーンレター、無限連鎖講、その他勧誘を目的とするコンテンツをアップロードしたり掲示したり、メールなどの方法で送信(発信)すること。 </p> <p> コンピュータのソフトウェア、ハードウェア、通信機器の機能を妨害、破壊、制限するようにデザインされたコンピュータウィルス、コンピュータコード、ファイル、プログラムを含むコンテンツをアップロードしたり掲示したり、メールなどの方法で送信(発信)すること。 画面上での対話の流れを妨害したり、他のユーザーがキーボードから入力できないようなスピードで画面をスクロールさせるなど、方法のいかんを問わず他のユーザーがリアルタイムに操作、入力しようとすることに悪い影響をおよぼすような行為。 サービスまたはサービスに接続しているサーバーもしくはネットワークを妨害したり、混乱させたりすること、あるいはサービスに接続しているネットワークの使用条件、操作手順、諸規約、規定に従わないこと。 故意、過失を問わず法令に違背する行為を行うこと。 ストーキング行為を行うなど、方法のいかんを問わず第三者に対する嫌がらせを行うこと。 他のユーザーの個人情報を収集したり蓄積すること、またはこれらの行為をしようとすること。 知りたいコミュニティーは、事前にコンテンツを検閲することはいたしません。しかし、知りたいコミュニティーが必要と判断した場合には、サービスを通じて送信(発信)されるコンテンツを削除し、または掲載場所を変更することができるものとします。この知りたいコミュニティーの削除権には、本規約に違反するコンテンツおよび知りたいコミュニティーが問題があると判断したコンテンツを削除する権利も含まれております。 ユーザーがコンテンツを利用される際は、内容の信頼性、正確性、完成度、有用性(有益性)などについてご自身で判断され、ご自身の責任とリスク負担のもとで行うことに同意するものします。したがって、たとえば掲示板などのすべてのサービスを含め、知りたいコミュニティーに掲載されているコンテンツは、信用(信頼)することができないものである可能性があることをよくご認識ください。 </p> <p> 法令に従って要請されたとき、または法律手続上必要な場合、本規約を遵守していただくために必要な場合、第三者の権利を侵害しているコンテンツに対するクレームに対応するために必要な場合、知りたいコミュニティーまたはユーザーの財産、権利、生命身体・業務等の安全や公益を守るために必要な場合など、知りたいコミュニティーが必要であると判断したときは、知りたいコミュニティーはコンテンツおよびコンテンツに係る情報を保存し、または開示することができるものとします。 </p> <p> ユーザーはコンテンツを含むサービスの送信(発信)を受信する過程で、種々のネットワークを経由することがあることを理解し、接続しているネットワークや機器、機材によっては、それらに接続したり、それらを通過するために必要なデータ、信号等の変更がなされる可能性があることを理解したうえで、サービスを利用するものとします。 </p> </div> </p> <!-- submitを押すとトークンが送られる --> <input type="hidden" name="csrf_token" value="<?php echo h(setToken()); ?>"> <p> <input type="submit" value="ブログを作成する"> </p> </form> </main> </aside> </div> </body> </html>

style.css

body { width: 800px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; border: thin solid; background-color: rgb(206, 199, 199); } header { height: 70px; border: thin solid; background-color: rgb(211, 252, 64); } div { display: flex; flex: 1; border: thin solid; background-color: rgb(219, 243, 131); } aside { flex: 1; border: thin solid; } nav { width: 250px; } #pic {/*親divには position: relative*/ position: relative; } #pic p { /*pタグには position: absolute*/ position: absolute; color: white;/*文字は白に*/ font-weight: bold; /*太字に*/ font-family :Quicksand, sans-serif;/*Google Font*/ top: 0; left: 0; } #pic img { width: 650px; height: 100px; border: thin solid; }

試したこと

ここに問題に対して試したことを記載してください。

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

divタグに、display: flex; があたっていることが原因のようです。

#wrapperに、display: block;を追加してみてください。

投稿2020/10/01 11:29

satokei

総合スコア1204

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Akki-ra

2020/10/01 12:04

文章にbr入れたらうまくいきました
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問