• コミュニティ

  文字の詰め方を知りたい

  トピックス by widget初心者 1792 pt  2023年11月1日 12:14 185 PV

  【Widget名】

  デイリーカウントダウンタイマー付きランキングボックス※要Javascript(囲み枠)

  【相談内容】

  既存の王冠マークのランキングを削除して、文字を左詰めにして表示をしたいのですが、現状だとスマホで表示した際に左に2文字ずつ詰められて表示されてしまうため、スマホで表示された際も左詰めかつ一文で表示されるよう修正いただけますと幸いでございます。

  文字.png 272 KB 画像ファイル — クリックして 見る

  • コピーダウンロードリンク

  

  widgetマスター   6 月, 3 数週間前 2 人 · 1 コメント

  • widget
  • デイリーカウントダウンタイマー付きランキングボックス※要Javascript(囲み枠)
• 1 コメント

• 

  widgetマスター

  モデレータ

  2023年11月1日 12:17

  下記のように修正してください！

  CSS

  .rankings-limit-head .image {
      aspect-ratio: 21/16;
      position: relative;
      display: none; /* 追加 */
  }

  ・display: none; を追加

  .rankings-limit-head {
      background-color: #333c5e;
      padding: 0.5em 1em;
      color: #ffffff;
      font-size: 2em;
      font-weight: 600;
      display: grid;
      grid-template-columns: auto; /* 変更 */
      column-gap: 0.5em;
      align-items: center;
  }

  .rankings-limit-head {
      grid-template-columns: auto; /* 変更 */
    }

  ・grid-template-columns をauto に変更する

  ※2か所あるので両方とも変更してください

  よろしくお願いします！

Log In to Reply