0

我是使用 div 标签的新手,我一直在努力解决这个问题。我已经搜索了几个小时,但似乎找不到一个好的解决方案。

我目前正在一个 div 元素中制作水平菜单。我不能使用嵌套在一个中的多个 div 元素,因为这会在我调整浏览器大小时导致元素换行。我不能使用 float:left 因为当我调整浏览器大小时这也会导致元素换行。

我已经测试了上述和其他多个代码片段,但我无法删除菜单中链接之间的空格。这是我的代码。

<div style=" display:inline-block; width:100%; padding: 0.1em 0.6em; border-collapse:collapse; max-height:100px; margin-top:-1px; margin-left:30%; overflow-y:hidden;">

<img src="logo.png" />
<img src="cornerthing4.png" /><a href="index.php"><img src="homebtn.png"></a><a href="index.php"><img src="faqbtn.png"></a><img src="cornerthing3.png">



</div>

我正在使用样式标签,因为我现在正在尝试设计页面,我将在完成后将 css 代码移动到 css 文件中。

<a href>删除标签后,图像并排放置在我想要的位置。我一贴上标签,它们之间就会获得 20 像素的空间。

关于为什么会发生这种情况以及如何纠正它的任何见解都会很棒。

编辑:代码在 jfiddle 中工作,但是,它在我的网站上不起作用。这是该网站的链接:http: //matxor.net/header.php

4

3 回答 3

4

Your a style has a margin. This margin is not present in the markup you pasted here. Is that what you're trying to get rid of?

a:link {
  margin-left: 30px;
  color: #0A58A5;
  text-decoration: none;
  font-weight: bold;
}
于 2012-08-31T21:29:21.737 回答
2

Take the margin-left:30px rule off <a> tags and it will look how you want it.

于 2012-08-31T21:29:45.923 回答
1

我目前正在一个 div 元素中制作水平菜单。我不能使用嵌套在一个中的多个 div 元素,因为这会在我调整浏览器大小时导致元素换行。我不能使用 float:left 因为当我调整浏览器大小时这也会导致元素换行。

你当然可以!

http://jsfiddle.net/charlescarver/fY48A/

在这个例子中,元素不会自己包裹,容器 div 仍然100%是宽度。

于 2012-08-31T21:26:04.827 回答