ここに改行/スペースを追加して、新しいCSSボックスを作成することは可能ですか？

[45thj5ej]

説明のしようがないので、写真をお見せします。

赤い枠の部分に、「New & Unread Topics」エリアを別の「ボックス/バブル」にしたいです。波線になっている赤い部分はそのエリアをスペースにしたいです。そして、「Tracking」のベルアイコンの下の部分も、それ自体で一つの「ボックス/バブル」にしたいです。基本的に、これを2つの丸みを帯びた境界線で、間にスペースを設けるようにしたいのです。要するに、「New & Unread Topics」エリアを、そのすぐ上にあるものから切り離したいのです。これは可能でしょうか？もし可能なら、方法を教えてください。

Topicsエリアには suggested-topics というdiv IDと more-topics__list というdivクラスがあるようです。そして、そのすべてを囲んでいる丸みを帯びたボックス全体は main-outlet だと思いますが、Trackingベルアイコンがある上のエリアがどれなのかは分かりません。

なので、このように見せたいのです。

赤い枠は、上記で言及した「ボックス/バブル」を示しています。間のオレンジ色の線は、それらの間にスペースを設けたい場所です。はい、通常推奨されるCSSのトピックなどはすべて読みました。6時間ほどいじってみましたが、どうしても分かりません。いじってみたところ、以下のようにすると：

.more-topics__list{
  display:none;
}

Trackingベルアイコンと一番下の「Want to read more?..」の間にあるすべてのものが基本的に削除されるようですが、コンテンツを保持したままセクションを分割したい場合には、あまり役に立ちません。

[manuel (Manuel Kostka)]

テンプレートを変更しないと、セクションを2つのコンテナに分割することはできません。デフォルトのテンプレートはCSSのみでは調整できないと思います。なぜなら：

@45thj5ej

すべてを囲んでいるのは main-outlet です

デフォルトのテンプレートには、他にラッパーがありません。

[pfaffman (Jay Pfaffman)]

プラグインのアウトレットがあるかどうかを確認できます

[Don]

こんにちは

Discourse Air Theme を使用していると仮定します。

このようなことは達成できます。

共通CSS

body.archetype-regular,
body.archetype-banner,
body.archetype-private_message {
  #main-outlet {
    margin-top: 30px;
    margin-bottom: 0px;
    background: transparent !important;
    box-shadow: none;
    padding: 0em 0em 5%;
    width: 100% !important;
  
    #topic-title {
      margin-bottom: 0;
      background: var(--secondary);
      padding: 3em 3em 1em;
      border-radius: 1em 1em 0 0;
    }
  
    .container.posts {
      margin-bottom: 0;
      background: var(--secondary);
      padding: 0 3em var(--below-topic-margin);
    }
  
    .topic-above-footer-buttons-outlet.presence {
      margin: 0;
      padding: var(--below-topic-margin) 0;
      background: var(--secondary);
    }
  
    #topic-footer-buttons {
      max-width: 100%;
      background: var(--secondary);
      border-radius: 0 0 1em 1em;
      margin: 0;
      padding: var(--below-topic-margin) 3em 1em;
    }
  
    .more-topics__container {
      border-radius: 1em;
      background: var(--secondary);
      max-width: 100%;
      padding: 3em;
    }
  }
}

[manuel (Manuel Kostka)]

はは、それは仕事量を考えると私が選ばない選択肢ですね！@Don さん、よくやりました

[45thj5ej]

この返信、本当にありがとう！