css - 我的目录页的过早回车

Question

我正在使用一个程序 (Pressbooks) 来出版一本书。我正在做一个目录，有章节。我遇到的情况是，如果一个标题有很多单词，即使它们很容易也不会全部放在一行中；标题分为两行。我想弄清楚要更改什么设置，以便整个标题都在一行上。

例如instead of

11. The boy goes to school

every day

I would like

11. The boy goes to school every

我愿意一天。

这是(我认为)相关的 CSS 代码:

#toc {
  page-break-before: right;
  counter-reset: part;
  font-family: "Noto Serif", "Georgia", "Times New Roman", serif;
  font-size: 1.1em;
 }

#toc h1 {
  text-align: center;
  font-weight: bold;
  font-style: normal;
}

#toc a {
  border: none;
  color: inherit;
}

#toc ul,
#toc li {
  list-style: none;
  margin: 0;
  padding: 0;
}

#toc ul {
  counter-reset: chapter;
  line-height: 1.2em;
}

#toc li {
  position: relative;
}

#toc .front-matter,
#toc .back-matter {
  margin-bottom: 3px;
  font-style: normal;
  font-size: 1.0em;
}

#toc .front-matter .introduction {
  font-style: normal;
}

#toc a::after {
  content: leader(" ") target-counter(attr(href), page);
  font-style: normal;
  font-weight: lighter;
  position: absolute;
  top: 0;
  right: 0;
  text-decoration: none;
}

#toc .front-matter a::after {
  content: leader(" ") target-counter(attr(href), page, lower-roman);
}

#toc .introduction a::after {
  content: leader(" ") target-counter(attr(href), page);
}

#toc .part {
  margin: .5cm 0 0;
  font-weight: 600;
  line-height: 1.2em;
}

#toc .part a::before {
  content: "Part " counter(part, upper-roman) ". ";
  counter-increment: part;
  margin-right: 0.5em;
}

#toc .chapter a {
   padding-left: 0px;
}

#toc .chapter {
  margin-top: 0.5cm;
}

#toc .chapter a::before {
  content: counter(chapter) ". ";
  counter-increment: chapter;
  margin-right: 7pt;
  position: absolute;
  left: 0;
  top: 0;
}

#toc .part a::after {
  content: '';
}

#toc span.toc-chapter-title {
  display: inline-block;
  font-size: 0.9em;
  font-style: normal;
  font-weight: 600;
  width: 70%;
}

#toc .chapter + .back-matter {
  margin-top: 1.3em;
}

#toc span.chapter-author,
#toc span.chapter-subtitle {
  display: inline-block;
  text-indent: 0;
  width: 70%;
}

#toc span.chapter-subtitle {
  font-size: 0.8em;
}

#toc span.chapter-author {
  font-family: "Alegreya SC", "Libre Baskerville", serif;
  text-transform: uppercase;
  font-size: 0.8em;
  position: relative;
}

#toc h1 {
  margin-top: 20pt;
}

#toc .front-matter,
#toc .back-matter,
#toc .chapter {
  margin-bottom: 0.2px;
  margin-top: 0.2px;
}

#toc .part {
  margin: 1em 0 0;
  font-size: 1.1em;
  margin-bottom: 0.75em;
}

#toc .chapter {
  margin-top: 0.15em;
}

#toc .chapter span.chapter-subtitle,
#toc .chapter span.chapter-author {
  margin-left: 20pt;
}

Answer 1

没有html很难知道，不过你可以试试把70%的宽度修改成95或者100%

#toc span.toc-chapter-title {
  display: inline-block;
  font-size: 0.9em;
  font-style: normal;
  font-weight: 600;
  width: 100%;
}