HTML – 如何并排放置两个段落(彼此相邻)?

HTML – 如何并排放置两个段落(彼此相邻)?,第1张

概述我有两个由父div包装的div容器.每个子div包含带标题的段落.如果我尝试将这两个段落(包括标题)在同一行中彼此相邻,它们就不会停留.他们只是分解并坐在其他人的下面. 如何将它们彼此相邻,并且从顶部开始保持相同的余量? 注意我总是希望保留与第一段演示中显示的文本数量相同的文本. HTML: <div id="gallery-text"> <div id="gallery-text-le 我有两个由父div包装的div容器.每个子div包含带标题的段落.如果我尝试将这两个段落(包括标题)在同一行中彼此相邻,它们就不会停留.他们只是分解并坐在其他人的下面.
如何将它们彼此相邻,并且从顶部开始保持相同的余量?

注意我总是希望保留与第一段演示中显示的文本数量相同的文本.

HTML:

<div ID="gallery-text">    <div ID="gallery-text-left" >    <p ID="gallery-text-quote-left" ><b>I am not interested in shooting new things,I am interested to see things new.</b></p>    <p ID="gallery-paragraph-1" >    bodybodybodybodybodybodybodybodybodybodybodybodybodybody    bodybodybodybodybodybodybodybodybodybodybodybodybodybody    bodybodybodybodybodybodybodybodybodybodybodybodybodybody    </p>    </div>    <div ID="gallery-text-right" >    <p ID="gallery-text-quote-right" ><b>External photo albums</b></p>    <p ID="gallery-paragraph-2" >    <a>link coming soon</a>    </p>    </div></div>

.CSS:

#gallery-text-left{}#gallery-paragraph-1{border-left:8px solID #3CB371;border-radius:4px;padding-left:15px;}#gallery-paragraph-2{border-left:8px solID #3CB371;border-radius:4px;padding-left:15px;}#gallery-text-right{}

请看看我的Demo.

解决方法 这将起作用,但当窗口宽度低于某个点时,文本将位于其他文本的下方

#gallery-text-left{float:left;wIDth:50%}

我会考虑使用像bootstrap这样的东西,而不是自己编写一切

总结

以上是内存溢出为你收集整理的HTML – 如何并排放置两个段落(彼此相邻)?全部内容,希望文章能够帮你解决HTML – 如何并排放置两个段落(彼此相邻)?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://www.outofmemory.cn/web/1084837.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存