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

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

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

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

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

Q&A

解決済

1回答

2984閲覧

Laravel5.7の認証画面のレイアウトが崩れている

rock_square

総合スコア14

PHP

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

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

1グッド

0クリップ

投稿2019/02/07 07:28

Laravel5.7の認証画面のレイアウトが崩れている

前提・実現したいこと

Laravel5.7で認証機能を追加しました。

php artisan make:auth php artisan migrate

Register画面にアクセスしたのですが、レイアウトが崩れて表示されました。
イメージ説明

特に編集していませんが、layouts\app.blade.php は以下の通りです。

layouts\app.blade.php

1<!DOCTYPE html> 2<html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 7 <!-- CSRF Token --> 8 <meta name="csrf-token" content="{{ csrf_token() }}"> 9 10 <title>{{ config('app.name', 'Laravel') }}</title> 11 12 <!-- Scripts --> 13 <script src="{{ asset('js/app.js') }}" defer></script> 14 15 <!-- Fonts --> 16 <link rel="dns-prefetch" href="//fonts.gstatic.com"> 17 <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet" type="text/css"> 18 19 <!-- Styles --> 20 <link href="{{ asset('css/app.css') }}" rel="stylesheet"> 21</head> 22<body> 23 <div id="app"> 24 <nav class="navbar navbar-expand-md navbar-light navbar-laravel"> 25 <div class="container"> 26 <a class="navbar-brand" href="{{ url('/') }}"> 27 {{ config('app.name', 'Laravel') }} 28 </a> 29 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}"> 30 <span class="navbar-toggler-icon"></span> 31 </button> 32 33 <div class="collapse navbar-collapse" id="navbarSupportedContent"> 34 <!-- Left Side Of Navbar --> 35 <ul class="navbar-nav mr-auto"> 36 37 </ul> 38 39 <!-- Right Side Of Navbar --> 40 <ul class="navbar-nav ml-auto"> 41 <!-- Authentication Links --> 42 @guest 43 <li class="nav-item"> 44 <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a> 45 </li> 46 @if (Route::has('register')) 47 <li class="nav-item"> 48 <a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a> 49 </li> 50 @endif 51 @else 52 <li class="nav-item dropdown"> 53 <a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre> 54 {{ Auth::user()->name }} <span class="caret"></span> 55 </a> 56 57 <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown"> 58 <a class="dropdown-item" href="{{ route('logout') }}" 59 onclick="event.preventDefault(); 60 document.getElementById('logout-form').submit();"> 61 {{ __('Logout') }} 62 </a> 63 64 <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;"> 65 @csrf 66 </form> 67 </div> 68 </li> 69 @endguest 70 </ul> 71 </div> 72 </div> 73 </nav> 74 75 <main class="py-4"> 76 @yield('content') 77 </main> 78 </div> 79</body> 80</html> 81

これまでLaravel5.5を使用していたのですが、こちらは特にレイアウト崩れなどは発生しませんでした。
イメージ説明

レイアウト崩れを直したいです。
修正点がわかりましたら、ご教示いただけると助かります。
よろしくお願いいたします。

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

◆動作環境
・Windows10 Pro 64bit
・Apache2.4
・PHP7.1
・Laravel5.7
・MySQL5.7

akoro👍を押しています

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

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

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

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

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

guest

回答1

0

自己解決

サーバーの要件で

PHP >= 7.1.3
Ctype PHP拡張
JSON PHP拡張
BCMath PHP拡張

を満たしていませんでした。

こちらPHPのバージョン適用と、モジュールを追加したところ、正常に表示されました。
イメージ説明

初歩的な部分で、確認ができていませんでした。
お騒がせいたしました。

投稿2019/02/07 08:07

編集2019/02/07 08:09
rock_square

総合スコア14

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問