试图说服CSS图像水平排列 [英] Trying to persuade CSS images to line up horizontally
问题描述
我是一名CSS新手尝试制作三张缩略图图片未成功
水平显示而不是垂直显示。我怀疑我错过了
一些非常愚蠢的东西但是如果有人能够好意的话，我会采取措施
指向正确的方向（使用教区牧师的话）的妻子
会理解。垂直缩略图可以在这个页面的底部看到：
$ nofollowhref =http://www.zen86793.zen.co.uk/gmga2008/index.html target =_ blank> http://www.zen86793.zen.co.uk/gmga2008/index.html ...
第一张图片位于正确位置我想移动另外两个
到它右边。
感谢您的帮助。
Stan
I''m a CSS novice trying unsuccessfully to make three thumbnail images
display horizontally instead of vertically. I suspect I''m missing
something really stupid but I''ll take the flak if someone could kindly
point me in the right direction (using words that the vicar''s wife
would understand). The vertical thumbnails can be seen at the bottom of
this page: http://www.zen86793.zen.co.uk/gmga2008/index.html ... the
first image is in the right position and I want to move the other two
to the right of it.
Thank you for any help.
Stan
推荐答案
文章< 48 ****************** *****@news.zen.co.uk>，
Stan The Man< ma*@pr100.comwrote：
In article <48***********************@news.zen.co.uk>,
Stan The Man <ma*@pr100.comwrote:
我是CSS新手尝试制作三个缩略图无法成功
水平显示而不是垂直显示。我怀疑我错过了
一些非常愚蠢的东西但是如果有人能够好意的话，我会采取措施
指向正确的方向（使用教区牧师的话）的妻子
会理解。垂直缩略图可以在这个页面的底部看到：
$ nofollowhref =http://www.zen86793.zen.co.uk/gmga2008/index.html target =_ blank> http://www.zen86793.zen.co.uk/gmga2008/index.html ...
第一张图片位于正确位置我想把另外两个
移到它的右边。
I''m a CSS novice trying unsuccessfully to make three thumbnail images
display horizontally instead of vertically. I suspect I''m missing
something really stupid but I''ll take the flak if someone could kindly
point me in the right direction (using words that the vicar''s wife
would understand). The vertical thumbnails can be seen at the bottom of
this page: http://www.zen86793.zen.co.uk/gmga2008/index.html ... the
first image is in the right position and I want to move the other two
to the right of it.
首先 - 总是 - HTML，见
< br $> b $ b< http://tinyurl.com/4papws>
-
dorayme
First - always - the HTML, see
<http://tinyurl.com/4papws>
--
dorayme
Stan The Man写道：
Stan The Man wrote:
垂直缩略图可以在这个
页面的底部看到：< a rel =nofollowhref =http://www.zen86793.zen.co.uk/gmga2008/index.htmltarget =_ blank> http://www.zen86793.zen.co.uk/gmga2008 /index.html ...第一张
图片处于正确位置，我想将其他两张图片移到
右边。
The vertical thumbnails can be seen at the bottom of this
page: http://www.zen86793.zen.co.uk/gmga2008/index.html ... the first
image is in the right position and I want to move the other two to the
right of it.
是的，请按照dorayme的建议进行验证。
完成后，立即回答您的问题涉及
你为#pic设置的宽度。
你不需要HTML评论分隔符< - - 为你的CSS。
为什么不使用display：none来隐藏你的大型弹出式图像而不是
height：1px;宽度：1px？
请不要使用clagnut方法搞砸网站。
将体内规则集中的62.5％替换为100 ％，并删除1.3em
et.al.你补充说它已经补充了。即，在#container中，替换：
字体大小：1.3em;
行高：1.3em;
with：
line-height：1.2;
或者只是删除行高。您可以降级或
修改或删除您添加到h1-h3规则中的字体大小。
HTH
-
John
想知道牧师的妻子是多么迟钝，因为我还没见过她。 br />
思考UIP的价值： http://improve-usenet.org /
On 2008-06-30 08:33:12 +0100，John Hosking
< Jo ** @ DELETE.Hosking.name.INVALIDsaid：
On 2008-06-30 08:33:12 +0100, John Hosking
<Jo**@DELETE.Hosking.name.INVALIDsaid:
Stan The Man写道：
Stan The Man wrote:
>垂直缩略图可以在本页底部看到：
http://www.zen86793.zen.co.uk/gmga2008/index.html ...第一张图片
位于正确的位置，我想将另外两张图片移到右边<它的。
>The vertical thumbnails can be seen at the bottom of this page:
http://www.zen86793.zen.co.uk/gmga2008/index.html ... the first image
is in the right position and I want to move the other two to the right
of it.
是的，请按照dorayme的建议进行验证。
完成后，立即回答您的问题涉及
你为#pic设置的宽度。
你不需要HTML评论分隔符< - - 为你的CSS。
为什么不使用display：none来隐藏你的大型弹出式图像而不是
height：1px;宽度：1px？
请不要使用clagnut方法搞砸网站。
将体内规则集中的62.5％替换为100 ％，并删除1.3em
et.al.你补充说它已经补充了。即，在#container中，替换：
字体大小：1.3em;
行高：1.3em;
with：
line-height：1.2;
或者只是删除行高。您可以降级
或修改或删除您添加到h1-h3规则中的字体大小，
。
Yes, do validate as dorayme suggested.
After you''ve done that, the immediate answer to your question involves
the width you''ve set for #pic.
You do not need HTML comment delimiters <-- --for your CSS.
Why not use display:none to hide your large pop-up images rather than
height:1px; width:1px?
Please, please don''t use the clagnut method of screwing up Web sites.
Replace 62.5% in your body ruleset with 100%, and delete the 1.3em
et.al. you''ve added to compensate for it. I.e., in #container, replace:
font-size: 1.3em;
line-height: 1.3em;
with:
line-height: 1.2;
or just delete the line-height altogether. You can probably downgrade
or revise or delete the font sizing you''ve added to the h1 - h3 rules,
too.
它确实有所帮助：非常感谢。我会看看那些基本的错误。
还会尝试显示：none（弹出窗口的代码是借用的，因为它对我来说太过技术性了;对我而言使用它因为它是唯一的悬停
popup我能找到它完全是CSS而不是JS）。 #pic
宽度是每个缩略图的原生宽度，即110px，我确实尝试了它只需要两个图像，只有两个图像，如果宽度是问题，但即便如此，他们
都垂直显示。所有三个缩略图都显示在
水平线上，如果我使用表格行来定位它们而不是
CSS ...所以我甚至尝试使用CSS里面的CSS表格细胞，但是
引起了混乱，不出所料。我的下一步是尝试使用不同的#img相对位置为每个图像尝试
，或者可能是
绝对位置......这是所有的试验和我的错误。
Stan
It does help: thank you very much. I will look at those basic errors.
Will also try display:none (the code for the pop-ups was borrowed as it
is much too technical for me; I used it because it was the only hover
popup I could find which is entirely CSS rather than JS). The #pic
width is the native width of each thumbnail, ie 110px and I did try it
with only two images in case width was the problem but even then they
both displayed vertically. All three thumbnails display nicely in a
horizontal line if I use a table row to position them instead of the
CSS... so I even tried using the CSS inside the table cells but that
caused mayhem, unsurprisingly. My next step was going to be to try
using different #img relative positions for each image, or maybe
absolute positions instead... It''s all trial and error for me.
Stan
这篇关于试图说服CSS图像水平排列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
