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

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

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

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

CSS

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

Q&A

解決済

1回答

333閲覧

コピーライト表記の下に入る一行を消したい

let

総合スコア41

HTML

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

CSS

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

0グッド

0クリップ

投稿2021/02/19 20:45

初心者です。
一番下に設定したく試してみているのですがどうしても一行空いてしまいます。
ご助言お願い致します。

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4<meta charset="utf-8"> 5<meta name="description" content="****************************"> 6<link href="reset.css" rel="stylesheet" type="text/css" madia="screen"> 7<link href="style.css" rel="stylesheet" type="text/css" madia="screen"> 8<link rel="shortcut icon" href="/favicon.ico"> 9<meta name="viewport" content="width=device-width,initial-scale=1.0"> 10             中略 11 12<footer> 13 <div class="sita"> 14 <img src="imges/ks_logol.png" alt=""> 15 </div> 16 <p class="adores">****************</p> 17 <div class="itibansita"> 18 <p class="tel">***************&nbsp; <span class="fax">****************</span></p> 19 </div> 20 <p class="kopi">&copy;****************** All rights reserved</p> 21 </footer> 22</html>

CSS

1footer{ 2 margin-top: 40px; 3 background-color:#ffffe0; 4 width: 100%; 5 height: 150px; 6 bottom: 0; 7} 8.sita{ 9 margin: 0 auto; 10 width: 960px; 11 max-width: 100%; 12 margin-top: 80px; 13 text-align: center; 14} 15.sita img{ 16 margin: 0 auto; 17 width: 960px; 18 max-width: 100%; 19 width: 50%; 20 margin-left: auto; 21 margin-right: auto; 22} 23.itibansita { 24 text-align: center; 25 margin: 0 auto; 26 width: 960px; 27 max-width: 100%; 28} 29.itibansita p{ 30 text-align: center; 31 margin: 0 auto; 32 width: 960px; 33 max-width: 100%; 34 padding-top: 10px; 35} 36.adores{ 37 text-align: center; 38 margin: 0 auto; 39 width: 960px; 40 max-width: 100%; 41 font-size: 18px; 42 margn-top:-10px; 43} 44.tel{ 45 color: #ff7f50; 46 font-size: 23px; 47 font-weight:bold; 48 padding-top:5px; 49} 50.fax{ 51 color: #32cd32; 52 font-size: 23px; 53 font-weight:bold; 54} 55.kopi{ 56 text-align: center; 57 margin:0 auto; 58 width: 960px; 59 padding-top: 15px; 60 bottom: 0; 61 right:0; 62 left: 0; 63 font-size: 18px; 64}

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

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

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

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

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

m.ts10806

2021/02/19 23:51

「こうなっているが」「こうしたい」 を具体的に 可能なら図示してください。
tomtomtomtom

2021/02/20 04:00

<p class="kopi">&copy;****************** All rights reserved</p>下の余白 (background-color:#ffffe0;の部分)を消したいということでしょうか?
guest

回答1

0

ベストアンサー

ご希望のことが、
.copeに設定しているbottom: 0;を効かせたいということなら、position: absolute;を設定する必要があります。同時に、footerposition: relative;も必要になります。
これで、footerの範囲を基準に絶対配置するという意味になります。

css

1footer{ 2 position: relative; /* 追加 */ 3} 4.kopi{ 5 text-align: center; 6 margin:0 auto; 7 width: 960px; 8 padding-top: 15px; 9 position: absolute; /* 追加 */ 10 bottom: 0; 11 right:0; 12 left: 0; 13 font-size: 18px; 14}

投稿2021/02/19 23:33

hatena19

総合スコア33620

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

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

let

2021/02/20 12:05

無事思い通りにできました、ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問