html - 主页多语言 css 对齐问题

Question

我们网站的主页有一些小的格式问题 Batoku当我们切换到另一种语言时(更改为意大利语进行测试)。

1) 更改语言时，“交换”文本未在箭头之间居中。 (#wrap-main #main-home #items a#swap)

a#swap {
    color: #449AC2;
    font-size: 26px;
    font-weight: bold;
    left: 467px;
    max-width: 135px;
    position: absolute;
    top: 194px;
    word-wrap: break-word;
}

2)页脚不居中，看起来不好看，当语言改变时，每行的元素不一致，如果你第一次喜欢底部的这个页面，没有空间写评论点赞。

3) 如果任何一种语言的文本非常大，标题可能会到处都是.. 在 <li id="add-item"> 下进行测试将跨度修改为 <span>I will destroy your header!!! </span> (请使用 Firebug )

谢谢

Answer 1

1) 关于swap，有一个固定的左边位置，也就是说它会一直呆在那里。最好通过一些带有 width: 100%; 的 div 包裹起来。 text-align: center; 或其他类似的东西使文本居中，而不是元素本身。

2) 关于页脚。 ul 的宽度是固定的。您应该删除它，向其添加“text-align:center”，从 li 元素中删除 float 并使它们 display: inline;

3) 对于 header 你应该责怪设计者。 :) 他们不是编码员，但至少他们应该问自己“如果有更多链接怎么办？”或者“一旦语言改变会发生什么？”，他们应该跳出框架思考一下。 这里没有任何东西可以阻止站点制动。您可以将其设置为绝对值，但一旦变大，它就会开始覆盖文本字段。那也不行。您可以使用某种 javascript 来检查它是否破坏了元素，并将某种类应用于导航以减小字体大小或更改元素的位置。