问题样式定义列表 [英] Problem styling definition list
问题描述
我在定义清单时遇到了问题。
如果看一下
http://68.178.211.60/ MattRandle / Guid ... arginalsNZ.htm
你会看到我想要达到的效果。但是，如果
花卉图像小于其
右侧的描述文字，我无法获得下一个定义术语来清除图像。
向下滚动页面到''Saururus'和''Scripus''你会看到
我的意思。
片段HTML是，
< dl>
< dt> Pontedeia< / dt>
< dt class = "图像">< IMG SRC ="指南/植物/ pontederia.jpg">< / DT>
将DD>文字去这里< / DD>
< / dl>
CSS是，
..pics dt {
保证金：0 0 10 0;
}
..pics dt.image {
宽度：200;
text-align：right;
float：left;
}
..pics dd {
填充：0;
保证金：-5 0 0 220;
}
A无法清除：留在.pics dt上因为导航栏上的
主页面向左浮动。
任何建议表示赞赏。
提前致谢，
马特
Hi,
I have a problem styling a definition list.
If you look at
http://68.178.211.60/MattRandle/Guid...arginalsNZ.htm
you will see the effect I am trying to achieve. If, however, the
flower image is smaller than the description text that appears to its
right, I cannot get the next definition term to clear the image.
Scroll down the page to ''Saururus'' and ''Scripus'' and you will see what
I mean.
Snippet of HTML is,
<dl>
<dt>Pontedeia</dt>
<dt class="image"><img src="Guides/Plants/pontederia.jpg"></dt>
<dd>Text goes here</dd>
</dl>
The CSS is,
..pics dt {
margin: 0 0 10 0;
}
..pics dt.image {
width :200;
text-align: right;
float: left;
}
..pics dd {
padding : 0;
margin: -5 0 0 220;
}
A cannot clear:left on the .pics dt because the navigation column on
the main page is floated left.
Any advice appreciated.
Thanks in advance,
Matt
推荐答案
ma ********* @ yahoo.com 写道：
我在设置定义列表时遇到了问题。 />如果你看看
HTTP：//68.178。 211.60 / MattRandle / Guid ... arginalsNZ.htm
你会看到我想要达到的效果。但是，如果
花图像小于其右侧显示的描述文本，我无法获得清除图像的下一个定义术语。
向下滚动页面为'' Saururus''和''Scripus''你会看到我的意思。
I have a problem styling a definition list.
If you look at
http://68.178.211.60/MattRandle/Guid...arginalsNZ.htm
you will see the effect I am trying to achieve. If, however, the
flower image is smaller than the description text that appears to its
right, I cannot get the next definition term to clear the image.
Scroll down the page to ''Saururus'' and ''Scripus'' and you will see what
I mean.
Mozilla / SM v1.0.0。
嗯，不，我不明白你的意思。一切看起来都一样。我看到了
产生的布局，但与你想象的有什么不同？
什么是清除图像是什么意思？
您尝试过哪些浏览器？
更正您的验证错误。
使用HTML 4.01 Strict DTD，不是过渡性的。 （你指定的DTD
是不完整的。）
-
jmm（连字符）列表（at）sohnen -moe（dot）com
（删除电子邮件的.AXSPAMGN）
Mozilla/SM v1.0.0.
Well, no, I don''t see what you mean. It all looks the same. I see the
resulting layout but how is that different from what you envision?
What does "clear the image" mean?
What browser(s) have you tried?
Correct your validation errors.
Use HTML 4.01 Strict DTD, not transitional. (And the DTD you do specify
is incomplete.)
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Mozilla / SM v1.0.0 。
好吧，不，我不明白你的意思。一切看起来都一样。我看到了
产生的布局，但是与你想象的有什么不同？
清除图像是什么？是什么意思？
你尝试了哪些浏览器？
纠正你的验证错误。
使用HTML 4.01严格的DTD，而不是过渡性的。 （你指定的DTD是不完整的。）
-
jmm（连字符）列表（at）sohnen-moe（点）com
（删除.AXSPAMGN for email）
Mozilla/SM v1.0.0.
Well, no, I don''t see what you mean. It all looks the same. I see the
resulting layout but how is that different from what you envision?
What does "clear the image" mean?
What browser(s) have you tried?
Correct your validation errors.
Use HTML 4.01 Strict DTD, not transitional. (And the DTD you do specify
is incomplete.)
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
我在IE6和Firefox中尝试过它。同样的效果。
通过清除图像我的意思是下一朵花的标题应该从下一行开始，而不是上一张图片的右边。
也许你有大文字大小设置所以你是不是得到了相同的
效果？正如我在原帖中所说，问题只发生在
图像右侧的文本小于图像时。
Matt
I have tried it in IE6 and Firefox. Same effect.
By "Clear the image" I mean that the heading for the next flower should
start on the next row, and not to the right of the previous image.
Maybe you have large text size set so you are not getting the same
effect ? As I said in my original post, the problem only happens when
the text to the right of the image is smaller than the image.
Matt
为了清楚起见，''Saururus'的文字小于
相关图像，以便'Scripus''不会在下一行开始
（因为图像向左浮动）。
Just to be clear, the text for ''Saururus'' is smaller than the
associated image so that ''Scripus'' doesn''t start on the next line
(because the image is floated left).
这篇关于问题样式定义列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
