HTML/CSS : Unwanted gap when box of text is embedded within other box of text

标签 html css

我想知道为什么绿色框中的第 4 行文本不像第 5 行那样从左边开始?为什么会有那个间隙?我怎样才能使第 4 行也像第 5 行一样从左边开始?

enter image description here

我写的上面页面的代码如下:

div 
    {   text-align: justify; text-justify: inter-word;  }

    .t1 { font-size: 30px; margin:0px; 	padding:10px; background:green;}
    .t2 { font-size: 10px; margin:20px;	padding:10px; background:red; 
          width: 200px; float:left;}
<?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml1-frameset.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >

    <head>

    </head>

    <body>
    <div>
	<p class="t2">  This is red box. This is red box. This is red box. This is red box. This is red box. This is red box. This is red box.
					This is red box. This is red box. This is red box. This is red box. </p>

	<p class="t1"> This is green box. This is green box. This is green box. This is green box. This is green box. This is green box. This
				   is green box. This is green box. This is green box. This is green box. This is green box. This is green box. This is 
				   green box. This is green box. This is green box. This is green box. This is green box. This is green box. This is green 
				   box. This is green box. This is green box. This is green box. This is green box. This is green box. This is green box.
				   This is green box. This is green box. This is green box. This is green box. This is green box. This is green box. This 	
				   is green box. This is green box. This is green box. This is green box. This is green box. This is green box. This is 
				   green box. This is green box. This is green box. This is green box. This is green box. This is green box. This is green 
				   box. This is green box. This is green box. This is green box. This is green box. This is green box. This is green box. 
				   This is green box. This is green box. This is green box. This is green box. This is green box. This is green box. 
	</p>
    </div>

    </body>
    </html>

谢谢

最佳答案

这很好用:

.t2 { font-size: 10px; margin:20px 20px 0px 20px; padding:10px 10px 0px 10px; background:red; 
      width: 200px; float:left;}

关于HTML/CSS : Unwanted gap when box of text is embedded within other box of text,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35286145/

相关文章:

jquery - 在传统动画之后使 span 元素具有固定宽度

html - 使 <a> 链接填充 <div> 的全高

html - 具有不同宽度和多个列表的居中 Logo

html - 两个浏览器显示两种不同的文本高亮颜色

javascript - 如何捕获双击复选框

html - CSS:无法将顶级属性设置为超过 100%

html - 在父 div 上溢出子 div 背景色

html - CSS 问题::之前在手机上

javascript - 使用 jquery-ajax 加载页面时内容重复

jquery - 如何确保当上一个下一个按钮点击 Flexslider 动画时重新启动?