如何在它们之间添加空格并使文本保持同一行 [英] How can I add a space between them and keep text same line

问题描述

如何在这两个图像之间添加一个空格，并且不允许文本在页面中心中断?这是一个大学项目，我以前从未编程过.我实际上不知道这个模板上发生了什么我必须编辑..我只需要在图像圈中添加一个人的照片(我知道如何)和他们的评论文本，但图像一直在消失位置和文本在中间中断..

/*TEMPLTED 的地平线templated.co @templatedco根据知识共享署名 3.0 许可免费发布 (templated.co/license)*/@import url("font-awesome.min.css");@import url("http://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,800,900");/* 基本的 */}身体 {背景:#222833；}身体，输入，选择，文本区域{颜色:#555555；font-family: 'Raleway', sans-serif;字体大小:13pt；字体粗细:300；行高:1.75em；}一种 {颜色:#3ac984；文字装饰:下划线；}一个:悬停{文字装饰:无；}强的，乙{字体粗细:700；}em，一世 {字体样式:斜体；}p,呃，哦，dl,桌子，块引用 {边距:0 0 2em 0；}h1,h2,h3，h4，h5，h6{颜色:继承；字体粗细:700；行高:1.75em；底边距:1em；}h1,h2 a,h3a，h4a，h5a，h6 a {颜色:继承；文字装饰:无；}h2{字体大小:1.5em；}h3{字体大小:1.25em；}子{字体大小:0.8em；位置:相对；顶部:0.5em；}补{字体大小:0.8em；位置:相对；顶部:-0.5em；}小时{边框顶部:实心 1px #888888;边框:0；底边距:1.5em；}块引用 {左边框:实心 0.5em #888888；字体样式:斜体；填充:1em 0 1em 2em；}特别版，文章.特别{文本对齐:居中；}标题.主要{填充底部:4em；}标题 h2 {边距:0；填充:0；字体大小:3em；字体粗细:600；}标题.byline {字体大小:1.6em；}页脚>:最后一个孩子 {底边距:0；}页脚.主要{填充顶部:3em；}/* 形式 */输入[类型=文本"]，输入[类型=密码"]，输入[类型=电子邮件"]，文本区域{-moz-外观:无；-webkit 外观:无；-o-外观:无；-ms-外观:无；外观:无；背景:无；边框:实心 1px #888888;颜色:继承；显示:块；大纲:0；填充:0.75em；文字装饰:无；宽度:100%；}输入[类型=文本"]:焦点，输入[类型=密码"]:焦点，输入[类型=电子邮件"]:焦点，文本区域:焦点{边框颜色:#3ac984；}输入[类型=文本"]，输入[类型=密码"]，输入[类型=电子邮件"] {行高:1em；}::-webkit-input-placeholder {颜色:继承；不透明度:0.5；位置:相对；顶部:3px；}:-moz-占位符{颜色:继承；不透明度:0.5；}::-moz-占位符{颜色:继承；不透明度:0.5；}:-ms-input-placeholder {颜色:继承；不透明度:0.5；}.formerize-占位符{颜色:rgba(85, 85, 85, 0.5) ！重要；}/* 图片 */.图片 {边框:0；位置:相对；}.image.fit {显示:块；}.image.fit img {显示:块；宽度:100%；}.image.feature {显示:块；边距:0 0 2em 0；}.image.feature img {显示:块；宽度:100%；}.image.feature2 {显示:块；边距:0 0 5em 0；}.image.feature2 img {显示:块；宽度:100%；边界半径:50%；宽度:200px；高度:200px；浮动:左边距 40px；}/* 图标 */.图标 {位置:相对；}.icon:之前{内容: "";-moz-osx-font-smoothing:灰度；-webkit-font-smoothing:抗锯齿；字体系列:FontAwesome；字体样式:正常；字体粗细:正常；文本转换:无！重要；}.icon>.label {显示:无；}/* 列表 */ol.default {列表样式:十进制；填充左:1.25em；}ol.default li {填充左:0.25em；}ul{边距:0；填充:0；}ul.default {列表样式:无；}ul.default li {显示:块；填充:0.60em 0;边框顶部:1px 实心；边框颜色:rgba(192, 192, 192, 0.15);}ul.default>:第一个孩子 {填充顶部:0;边框顶部:无；}ul.icons {光标:默认；}ul.icons li {显示:内联块；行高:1em；padding-left: 0.5em;}ul.icons li:第一个孩子{填充左:0;}ul.actions {光标:默认；}ul.actions:last-child {底边距:0；}ul.actions li {显示:内联块；填充:0 0 0 1.5em；}ul.actions li:first-child {填充:0；}ul.actions.vertical li {显示:块；填充:1.5em 0 0 0；}ul.actions.vertical li:first-child {填充:0；}ul.联系李{填充:1.05em 0；边框顶部:1px 实心；边框颜色:rgba(192, 192, 192, 0.15);}ul.contact li>span {显示:内联块；}ul.contact li .address,ul.contact li .mail,ul.contact li .phone {向左飘浮;宽度:100px；字体粗细:600；}联系方式>:第一个孩子 {填充顶部:0;边框顶部:无；}ul.style li {清楚:两者；显示:块；填充顶部:3em；}ul.style>:第一个孩子 {填充顶部:0;}ul.style h3 {显示:块；边距:0；填充底部:0.50em；字体大小:1.1em；字体粗细:700；颜色:#404040；}ul.style .fa {向左飘浮;显示:内联块；宽度:80px；高度:80px；右边距:1em；背景:#3ac984；行高:80px；文本对齐:居中；边框半径:10px；字体大小:2em；白颜色;}ul.list {列表样式:无；}ul.list li {显示:块；填充:0.60em 0;边框顶部:1px 实心；边框颜色:红色；}ul.list>:第一个孩子 {填充顶部:0;边框顶部:无；}/* 表格 */桌子 {宽度:100%；}表.默认{宽度:100%；}table.default tbody tr {边框底部:实心 1px #888888;}table.default td {填充:0.5em 1em 0.5em 1em；}table.default th {字体粗细:700；填充:0.5em 1em 0.5em 1em；文本对齐:左；}table.default 头{背景:#555555；颜色:#fff;}/* 按钮 */输入[类型=提交"]，输入[类型=重置"]，输入[类型=按钮"]，.按钮 {-moz-外观:无；-webkit 外观:无；-o-外观:无；-ms-外观:无；外观:无；-moz-transition:背景颜色 0.2 秒缓入缓出；-webkit-transition: 背景色 0.2s 缓入缓出；-o-transition: 背景色 0.2s 缓入缓出；-ms-transition:背景色 0.2 秒缓入缓出；过渡:背景色 0.2 秒缓入缓出；背景:#3ac984；边框半径:40px；边框:0；白颜色;光标:指针；显示:内联块；填充:0.80em 2em；文本对齐:居中；文字装饰:无；字体大小:1.4em；字体粗细:600；最小宽度:10em；}输入[类型=提交"]:悬停，输入[类型=重置"]:悬停，输入[类型=按钮"]:悬停，.button:悬停{背景颜色:#32b777；}输入[type="submit"].fit，输入[type="reset"].fit，输入[type="button"].fit，.button.fit {宽度:100%；}输入[type="submit"].small,输入[type="reset"].small,输入[type="button"].small,.button.small {字体大小:0.8em；}/* 包装器 */.wrapper.style1 {背景:#fff;}.wrapper.style2 {背景:#ececec；填充:6em 0；文本对齐:居中；}.wrapper.style4 {背景:#ececec；填充:1em 0;文本对齐:居中；}.wrapper.style3 {填充:2em 0 3.5em 0；背景:#ececec；}.wrapper.style3 跨度{显示:内联块；填充顶部:0.80em；字体大小:2em；字体粗细:600；}.wrapper.style3 .button {浮动:对；}/* 标题 */#header {背景:#333333 url("../images/pic01.jpg") 不重复；背景尺寸:封面；颜色:#fff;填充:6em 0；文本对齐:居中；背景位置:0% 65%；位置:相对；}#header:之前{内容: '';位置:绝对；左:0；顶部:0；宽度:100%；高度:100%；背景:RGBA(16, 32, 48, 0.25);}#header>* {位置:相对；z-索引:1；}.homepage #header {填充:8em 0;背景位置:中心；}#标识 {字体大小:2em；}#nav>ul {边距:0；}#nav>ul>li {边界半径:10px 10px 0 0;显示:内联块；左边距:0.5em；填充:0.5em 1.5em；}#nav>ul>li a {颜色:#FFF；文字装饰:无；字体大小:1.2em；}#nav>ul>li:first-child {左边距:0；}#nav>ul>li: 悬停一个 {颜色:#fff;}#nav>ul>li.active {背景:#3ac984；}#nav>ul>li.active a {白颜色;}#nav>ul>li>ul {显示:无；}/* 投影仪 */.dropotron {边距顶部:-2px；背景:#3ac984；边框半径:10px；白颜色;最小宽度:12em；填充:1em 0;}.dropotron>li {行高:2em；填充:0 1em；}.dropotron>li>a {颜色:#FFF；文字装饰:无；}.dropotron>li.active>a,.dropotron>li:hover>a {颜色:#FFF；}.dropotron.level-0 {边框半径:0 10px 10px 10px;字体大小:1em；}/* 横幅 */#横幅 {文本对齐:居中；填充:4em 0 0 0；}#banner .major h2 {字体大小:3.5em；}#banner .major .byline {显示:块；边距:0em 2em；行高:1.6em；字体大小:1.5em；}#横幅{颜色:继承；}/* 主要的 */.no-sidebar #main .major,.left-sidebar #main .major,.right-sidebar #main .major {文本对齐:左；}.homepage #main .major {文本对齐:居中；}#主要的 {填充:6em 0；}#main .sidebar .major {填充底部:2em；}#main .sidebar .major h2 {字体大小:1.8em；}#main .sidebar .default li {边框颜色:#cdcdcd；}#main .sidebar .default a {颜色:#464646；}#main .sidebar>:第一个孩子 {底边距:3em；}/*页脚*/#页脚{填充:4em 0；颜色:#fff;}#footer .major h2 {字体大小:2em；颜色:#FFF；}#footer .major .byline {字体大小:1.1em；}#footer .copyright {边距顶部:3em；填充顶部:3em；边框顶部:1px 实心；边框颜色:rgba(192, 192, 192, 0.15);文本对齐:居中；颜色:继承；}#footer a {颜色:继承；}#中间 {高度:600px；宽度:300px；背景:绿色；}

<!--TEMPLTED 的地平线templated.co @templatedco根据知识共享署名 3.0 许可免费发布 (templated.co/license)--><头><title>地平线 by TEMPLATED</title><meta http-equiv="content-type" content="text/html; charset=utf-8"/><meta name="description" content=""/><meta name="keywords" content=""/><!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]--><script src="js/jquery.min.js"></script><script src="js/jquery.dropotron.min.js"></script><script src="js/skel.min.js"></script><script src="js/skel-layers.min.js"></script><script src="js/init.js"></script><noscript><link rel="stylesheet" href="css/skel.css"/><link rel="stylesheet" href="css/style.css"/></noscript><!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css"/><![endif]--><body class="主页"><!-- 标题--><div id="标题"><div class="容器"><!-- 标志 --><h1><a href="#" id="logo">Vista 702</a></h1><!-- 导航 --><nav id="导航"><ul><li><a href="#fotos">照片</a></li><li><a href="#depoimentos">Depoimentos</a></li><li><a href="#planos">Planos</a></li></nav><!-- 横幅--><div id="横幅"><div class="容器"><部分><header class="major"><h2>Vista 702</h2><span class="byline">&hellip;a melhor vista de Juiz de Fora para se passar o feriado, réveillon e comemorações em geral.</span></标题><a href="#" class="button alt">注册</a></节>

<!-- 精选--><div class="wrapper style2"><section class="容器"><header class="major"><a id="照片"></a><h2>照片</h2><span class="byline">Suavisita começa aqui.</span></标题><div class="row no-collapse-1"><section class="4u"><a class="图像特征"><img src="images/pic02.jpg" alt=""></a><p>Nam in massa.Sed veltellus.Curabitur sem urna，consequat vel，suscipit in，mattis placerat. </p></节><section class="4u"><a class="图像特征"><img src="images/pic03.jpg" alt=""></a><p>Donec ornare neque ac sem.毛里求斯.Aliquam sem leo, vulputate sed, convallis.Donec magna.</p></节><section class="4u"><a class="图像特征"><img src="images/pic04.jpg" alt=""></a><p>Curabitur sem urna, consequat vel, suscipit convallis sem leo, mattis placerat, nulla.</p></节>

</节>

<div class="wrapper style2"><section class="容器"><header class="major"><a id="depoimentos"></a><h2>Depoimentos</h2><span class="byline">Os viajantes recomendam.</span></标题><div class="row no-collapse-1"><section class=""><a class="image feature2"><img src="https://abrilexame.files.wordpress.com/2016/09/size_960_16_9_google-robert-bunsen.jpg" align="left"=""></a><p>Nam in massa.Sed veltellus.Curabitur sem urna，consequat vel，suscipit in，mattis placerat. </p></节><section class=""><a class="image feature2"><img src="https://eduardhosp-alemao.com.br/wp-content/uploads/2018/05/Hashtag-Google-Alem%C3%A3o-Sem-Complica%C3%A7%C3%A3o.jpg" align="left"></a><p>Curabitur sem urna, consequat vel, suscipit convallis sem leo, mattis placerat, nulla.</p></节>