• 締切済み

CSS flexの指定で折り返した時の左寄せ

Flexの指定をしているのですが、 思うようになりません。 ぜひアドバイスをお願いします。 スペースに収まりきらないものは改行させたいので、 flex-wrap:wrap; 折り返した行は、スペースを等しく開けたいので、 justify-content:space-between; を記載しています。 すると、最後の行が中途半端になった時 例えば、２個になった場合に、左右にコンテンツが分かれてしまい、 中央が大きく空いてしまいます。 スペースは同じで保ったまま、 最後の行は左に寄せて、右を開けた状態にしておきたいです。 今は空のコンテンツを入れて無理やり調整していますが、 何かスマートに実現する方法はないでしょうか？

  • tetish
  • お礼率91% (234/256)
  • CSS
  • 回答数1
  • ありがとう数0

みんなの回答

回答No.1

htmlとCSSのコードは、どうなっていますか？ 掲示が無いので、なんとも言えません。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. CSS

関連するQ&A

  • 【エクセル】セル最後にある無駄改行を検索・削除したい

    改行付きテキストデータを一杯持っているエクセルファイルがあるとします。 １つのセル複数の行があります。 最後の行になんらかの文字があればOKですが、 文字が無く、空の改行だけが存在する場合があります。 このような、最後の行が空の改行のセルを見つけて、検索・置換みたいな感じで最後の空改行だけ削除する方法はあるのでしょうか。 教えて頂ければ幸いです。どうぞよろしくお願い致します。

  • word2007を使っていて困っています．

    word2007を使っていますが，文章の途中で新しいページを挿入・追加すると，必ず前のページの最後の行が改行されてしまい，しかもその改行されたところはカーソルが行の初めではなく，中途半端なところにきてしまいます． だから文章をページで分けるときに，文章が最後の行に来ていたら，ページを追加したときに，前のページの改行で余分なページが１つできてしまい（つまり，見た目では２つ新しいページができたようになる．），しかもその余分なページにある行を削除しようとしたら，追加したページごと消えてしまいます． そうならないようにそのまま新しいページを挿入できる方法はないのでしょうか？

  • ワードの原稿用紙モード入力時、中途半端に改行

    ワードの原稿用紙モードで入力時にたまにあるのですが、 一行が２０文字なのに中途半端なところで改行されます。 設定ミスなのでしょうが、下手に触るとかえっておかしく なりそうで…。（今の状態はページ後半あたりの行の17文字 目で次の行に改行します）その後も同様に同位置で改行されます。 まるでそこからは17文字の位置で設定したように！18文字目には 入力されません。 また、これもまた以前から腑に落ちないのですが、 誤って次の行に入力してしまった時、元の位置に戻そうと 先頭文字にカーソルを合わせてバックスペースで戻ろうとすると、 何度やっても戻らず、十回程度カチカチするとやっと元の 位置に戻るのです。逆に不必要にバックしたりで入力に無駄が 多くなってしまいます。 あまりワードを使いこなせていなく、分かる範囲でワードの設定は やりましが、お知恵を拝借いただけますでしょうか？

  • wordのインデント幅はどうして合わないんでしょうか？

    くだらない質問ですが、word(xp)にて文書作成の際、改行して次の行を字下げすると、幅が中途半端な値になり、上の行と合わないんですよね。 例えば、1行目の改行幅は「10mm」なのに、2行目の改行幅は「16.5mm」。また、何行か書くと今度は「99mm」など、上下の行の文字がどんどんずれていきます。 イニシャル設定等で対処できないもんでしょうか。 もうブチ切れそうです。。。

  • パワーポイントにて指定のフォントサイズで印刷できない

    あるパワーポイントの資料をプリントアウトすると指定のフォントサイズ（フォントサイズ９）よりもだいぶ大きくなってしまって印刷されてしまいます。（フォントサイズ見た目２０くらい） プレビューで見てもフォントのサイズは９で小さいままです。 改行や段落を揃えるなど、画面のレイアウトを整える前までは問題なく印刷できていました。 印刷後のフォントサイズがおかしくなる直前にしたことは： 文章を書いていて右端最後まできたら自然に次の段に落ちますが、その2行目の段落が1行目とあわず、（2行目は一番左端に行ってしまう）スペースで右に移動させようとしても動きません。 ですので、1行目の一番右の最後の単語を改行して2行目に落としてからだと、2行目をスペースで動かすことができて、1行目の段落と合わせられることができました。 よしっ、と思い印刷をしたところ、フォントサイズが大きくなって印刷されてしまう、ということになりました。 問題解決法を検索してみましたが、ドンピシャのものが見つけられません。 会社の資料なのでスクリーンショットを添付し説明するわけにもいかず、文章も稚拙でお恥ずかしいですが、わかる方いらっしゃいましたら教えてください！ よろしくお願いします。

  • Ajaxでgoogleのパーソナライズドホーム

    こんにちは。始めまして。ajax初心者です。 この度Ajaxを使いプログラムを作成しようと思っております。 表題にありますように、googleのパーソナライズドホームのようなものを 作成しようと思っております。 自分でコンテンツ追加し、ドラッグ＆ドロップで表示位置変更。 この表示位置変更の部分でご教授願いたいのですが ドラッグ＆ドロップで移動させるのはわかります。 が、ドラッグ中、中途半端な位置の時に適当な位置に 仮の表示位置を表示する方法がわかりません。 (googleだとドラッグ中に点線で表示されるところです。) それとコンテンツが 左列　　　　　中列 content_1　　content_2 ↓ ↓移動 ↓ 左列　　　　　中列　　　　　右列 　　　　　　content_1 　　　　　　content_2 と、上記のようにcontent_2の上にcontent_1挿入した場合 content_2が下段に表示されるようにするのは どうやって実現しているのでしょうか？ もしかしたらすごく簡単なことなのかもしれませんが ご教授よろしくお願いいたします。 googleをみたらいいじゃないというのはご勘弁を。 googleのソースを見てもいまいち・・・。

  • タイピング文字の一番後ろがおかしくなります。

    改行をしているせいなのか分かりませんが、タイピング文字の各行の一番最後に 「＞」とついてしまいます。 それは最後まで消えないのではなく、いったん画面に現われてから バックスペースで消したようにすぐ消えます。 一番最後の行には現われません。 直し方を教えてください。

    • ベストアンサー
    • HTML
  • Javascript初心者です助言おねがいします。

    オセロを作成しています。 盤面の上にaからhも文字を表示して盤面の左に１から８の文字を表示させたいのですが、どうもうまくいきません。どうすればよいでしょうか。 Javascript // ボードの上に a から h までの文字を表示する const letters = document.createElement("div"); letters.classList.add("letters"); for (let i = 0; i < 8; i++) { const letter = document.createElement("div"); letter.classList.add("letter"); letter.textContent = String.fromCharCode(97 + i); letters.appendChild(letter); } // ボードの左に 1 から 8 までの数字を表示する const numbers = document.createElement("div"); numbers.classList.add("numbers"); for (let i = 1; i <= 8; i++) { const number = document.createElement("div"); number.classList.add("number"); number.textContent = i; numbers.appendChild(number); } board.appendChild(numbers); // 盤面を作成 for (let row = 0; row < 8; row++) { for (let col = 0; col < 8; col++) { const cell = document.createElement("div"); cell.classList.add("cell"); cell.setAttribute("data-row", row); cell.setAttribute("data-col", col); board.appendChild(cell); cells[`${row}-${col}`] = cell; } board.appendChild(letters); } css .letters { display: flex; justify-content: space-between; margin-bottom: 8px; } .letter { width: 12.5%; text-align: center; } .numbers { display: flex; flex-direction: column; justify-content: space-between; margin-right: 8px; } .number { height: 12.5%; text-align: center; }

  • 簡単な論文の書き方

    原稿用紙２～３ページほどで自分の考えをまとめる論文を書いていまして、（会社内に提出するものなのでそれほど硬いものではないです） 論文の書き方の形式をネットで調べながら書いてみたのですが、なにかおかしいような感じがしています。 おおまかな形式を教えていただけると助かります。 ０１　　はじめに、＿＿＿の観点からお話をし ０２　たいと思います。＿＿＿を使った３つの ０３　取り組みです。 ０４ ０５　　ひとつめに、「＿＿＿」 ０６　＿＿＿＿＿＿＿＿＿、＿＿＿＿。＿＿ ０７　＿＿＿＿＿。 ０８　　ふたつめに、「＿＿＿＿＿＿」 ０９　＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ １０　＿＿＿＿＿＿＿＿＿＿＿。そして、＿ １１　＿＿＿＿＿＿＿＿＿。さらに、＿＿＿ １２　＿＿＿＿＿＿＿＿＿＿＿＿＿。 １３　　最後に、「＿＿＿」 １４　＿＿＿＿＿＿＿＿＿、＿＿＿＿＿＿＿ １５　＿＿＿＿＿＿。 １６　 １７　　おわりに、＿＿＿＿＿＿。＿＿＿＿＿ １８　＿＿＿＿、＿＿＿＿＿＿＿。 ０４行目を空白行にしてよいのか ０５行目は頭にひとつスペース入れてよいのか ０６行目は、０５行目から改行せずに書いたほうがよいのか ０８行目は、０７行目から改行せずに書いたほうがよいのか １０行目は、１２行目から改行せずに書いたほうがよいのか １６行目は空白行にしてよいのか 「最後に」、と「おわりに」がかぶっているようなのですが、 だいじょうぶでしょうか といった部分など… わかりにくい説明で申し訳ないのですが よろしくおねがいします。

  • CSSで定格文作成（署名文）について

    今8ページ構成でHPを作成しています。 ページの最後に問い合わせ先として、郵便番号・住所・TEL・メールアドレスを それぞれのページにCSSで入れています。 以下がソースです。 mainstyle.css p.t1:after { content: " ○○グループ"} p.t2:before { content: "（○○課）TEL(111)111-1111 FAX(111)111-1111"} p.t3:before { content: "（○○課）TEL(111)111-1111 FAX(111)111-1111"} p.t4:after { content: "（市外局番からダイヤルして下さい。）"} p.t5:after { content: "〒777-7777　○○7丁目7番7号"} main.html <body> <p class="t1">問い合わせ先：</t1> <p class="t2"></t2> <p class="t3"></t3> <p class="t4"></t4> <p class="t5"></t5> </body> これだと一行ごとに空白の改行が入ってしまいます。 空白の改行を入れない方法はありますか。 よろしくお願いします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する