重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

電子書籍の厳選無料作品が豊富！

おしえて

java フレームワーク：spring eclipseでcssが適用されない

解決済

  • 質問者：mountain11
  • 質問日時：
  • 回答数：2件

javaの初心者です。
eclipse で、フレームワークはspringを使って開発しています。

cssが適用されないページがあって、悩んでいます。
ソース（jsp）は下記です。

出荷日の「入力ボックス（from）～入力ボックス（to）」をテーブルの１つのセルの中に改行せずに表示させたいのですが、なぜか～の前で改行されてしまいます。

カラムの幅を1500と指定していますが、適用されていないようです。
初回に表示をされると適用されませんが、入力ボックスをクリックすると、改行されなくなります。

どなたか、常に改行されないよう表示する方法をご教授いただければ幸いです。

<!DOCTYPE html>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<html>
<head>
<style>
h1 { font-size:16pt; background-color:#CCCFF; padding:3px; }
p { color: #000066; }

.sampleTable{
table-layout: fixed;
white-space: nowrap;
}
</style>

<meta charset="utf-8">
<title>${title}</title>

<script src="<c:url value="/js/jkl-calendar.js" />" type="text/javascript"></script>
<script>
var cal2 = new JKL.Calendar("caldiv2","formid","Date_From");
cal2.setStyle( "frame_color", "#3333CC" );
var cal3 = new JKL.Calendar("caldiv3","formid","Date_To");
cal3.setStyle( "frame_color", "#CC3333" );
</script>

<script type="text/javascript">

function onLoad(){

if("${ErrorMessage}" != ""){
alert("${ErrorMessage}");
}
}

</script>

</head>
<body onLoad="onLoad()" bgcolor="#FFDAB9">
<h1>${title}</h1>
<p>${message}</p>

<form:form id="formid" modelAttribute="formSyukka">

※日付欄は、カーソルを置くとカレンダーが表示されるので、カレンダーから選択してください。<br>
<table class="sampleTable">
<%-- <colgroup> --%>
<%-- <col style='width:200px;'> --%>
<%-- <col style='width:1500px;'> --%>
<%-- </colgroup> --%>

<tbody>
<tr>
<td width="200"><B>出荷日：</B></td>
<td width="1500" style="white-space: nowrap;">
<form:input type="text" path="Date_From" name="Date_From" onClick="cal3.hide(); cal2.write();"
onChange="cal2.getFormValue(); cal2.hide();"/><div id="caldiv2"></div>～
<form:input type="text" path="Date_To" name="Date_To" onClick="cal2.hide(); cal3.write();"
onChange="cal3.getFormValue(); cal3.hide();"/><div id="caldiv3"></div>
</td>
</tr>
<tr><td width="200"><B>コード1：</B></td><td width="1500" style="white-space: nowrap;"><form:input path="Code" onClick="cal2.hide(); cal3.hide();" />※あいまい検索も可能です<br></td></tr>
<tr><td width="200"><B>コード名：</B></td><td width="1500" style="white-space: nowrap;"><form:input path="mei" onClick="cal2.hide(); cal3.hide();" />※あいまい検索も可能です<br></td></tr>
<tr><td width="200"><B>図1：</B></td><td width="1500" style="white-space: nowrap;"><form:input path="Zu" onClick="cal2.hide(); cal3.hide();" />※あいまい検索も可能です<br></td></tr>
<tr><td width="200"><B>端末ID：</B></td><td width="1500" style="white-space: nowrap;"><form:input path="TermID" size="3" maxlength="3" onClick="cal2.hide();" /><br><br></td></tr>
</tbody>
</table>

<input type="submit" name="syukka_search1" value="検索" ><br><br>
<input type="button" value="戻る" onClick="javascript:history.back()">

</form:form>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (2件)

No.2ベストアンサー

  • 回答者： tknakamuri
  • 回答日時：

>divがあると駄目なのでしょうか。


divはブロックタグなので無理です。

h1やpと同じといえば分かりますか？
    • good
    • 0
    • 件
通報する
この回答へのお礼

再度、回答をありがとうございます！
そうなんですね！
ということは、divはカレンダーを表示させるために必要なので、上記のやり方で改行を防ぐことはできないということですね。
他の方法を考えます。
ありがとうございました。

通報する
お礼日時：2018/08/27 10:07

No.1

  • 回答者： tknakamuri
  • 回答日時：

form:inputの間にdivが挟まってますが、そのせいでは？

    • good
    • 0
    • 件
通報する
この回答へのお礼

回答ありがとうございます。

divのところは、日付項目にカレンダーを表示するようカレンダーを指定しているのですが、divがあると駄目なのでしょうか。

通報する
お礼日時：2018/08/23 10:06

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報