Q&A
スタイルシートが適用されるのは、そのJavaクラスではなく、JSPファイルではないかと思います。
こちらの画像の背景の赤い枠を下まで伸ばしたいのですが
スタイルシートのheightをいくら数値を弄っても変わりません。
どうすれば下まで伸ばせるでしょうか？
対象の赤い場所はitemと書いてあるところだと思います。
スタイルシート
h1.title{text-align:center;} h1.title{font-size: 380%; } h1.title{color: gray;} h2.naka{color: gray;} .horizontal-list { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; } .item { display: inline-block; width: 30%; height: 100px; margin: 10px; font-size: 20px; background: rgba(255, 0, 0, 0.4); } form { margin: 0 auto; width: 600px; padding: 1em; border: 1px solid #CCC; border-radius: 1em; } ul { list-style: none; padding: 0; margin: 0; } form li + li { margin-top: 1em; }
スタイルシートを使っているjsp
<%@page import="movie.TitleListResult"%> <%@page contentType="text/html" pageEncoding="windows-31j"%> <%@page import="java.util.*"%> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="keywords" content="映画 洋画 邦画"> <meta http-equiv="content-language" content="ja"> <meta http-equiv="content-type" content="text/html:charset=Shift_JIS"> <meta http-equiv="content-style-type" content="text/css"> <link href="./style.css" rel="stylesheet" type="text/css"> <title>映画データベース</title> <meta name="keywords" content="映画"> </head> <body background="img/kuro.jpg"> <h1 class="title">映画データベース</h1> <form method="POST" action="Controller"> <input type="text" name="keyword" size="55" placeholder=" キーワードを入力してください"> <input type="submit" value="search"> <input type="search" name="category" list="data1"> <datalist id="data1"> <option value="全て"></option> <option value="タイトル名"></option> <option value="監督名"></option> <option value="主演名"></option> </datalist> </form> <% // サーブレットから渡された検索結果を取得する ArrayList<TitleListResult> results = (ArrayList<TitleListResult>)request.getAttribute("results"); %> <% if (results != null) { %> <h2 class="naka">検索結果</h2> <div id="kensaku"> <ul class="horizontal-list"> <% for (TitleListResult result : results) { %> <li class="item"> <dl> <dt>監督名</dt> <dd><%= result.Get_directed_name() %></dd> <dt>タイトル名</dt> <dd><%= result.Get_movie_name() %></dd> <dt>ジャンル</dt> <dd><%= result.Get_Genre_name() %></dd> <dt>原作</dt> <dd><%= result.Get_original_name() %></dd> <dt>主演</dt> <dd><%= result.Get_cast_name() %></dd> <dt>公開年</dt> <dd><%= result.Get_years_publication() %></dd> <dt>上映時間</dt> <dd><%= result.Get_Screening_time() %></dd> <dt>興行収入</dt> <dd><%= result.Get_performance_income() %></dd> <dt>制作費</dt> <dd><%= result.Get_Production_cost() %></dd> <dt>評価</dt> <dd><%= result.Get_Public_evaluation() %></dd> </dl> </li> <% } %> </ul> </div> <% } %> </body> </htmt>
回答2件
0
自己解決
キャッシュクリアしたらいけました
投稿2020/08/23 02:58
総合スコア15
0
スタイルシートの
css
1.item { 2 display: inline-block; 3 width: 30%; 4 5 height: 100px;
height: 100px; ではなく、100% の誤りでしょうか？
投稿2020/08/22 14:02
総合スコア12011
あなたの回答
tips
プレビュー
