小编Ale*_*lex的帖子

CSS 列在 Safari 中未对齐

I\xe2\x80\x99m 使用 CSS 列在我的网站上获得多列主导航(www.alexanderschlosser.de/wordpress \xe2\x80\x93 使用 Semplice 构建)。在 Chrome 中一切正常,但在 Safari 中列的顶部未正确对齐。知道什么可能导致这个问题吗?_

\n\n

这里\xe2\x80\x99是它在Chrome中的样子,并且应该在任何地方都可以看到:\n Chrome渲染

\n\n

这里\xe2\x80\x99是它在Safari中的样子(第二列开始变低):\n Safari 渲染

\n\n

更奇怪的是\xe2\x80\x99:当我使用检查器时,Safari 似乎仍然认为元素都在彼此的下面。这可能是问题所在吗?\n Safari Inspector Screenshot

\n\n

_

\n\n

这里\xe2\x80\x99是我的CSS

\n\n
/***VERTICAL MENU IN TWO COLUMNS***/\nnav.standard ul {\n    display: block !important; \n    columns: 2;\n    -webkit-columns: 2;\n    -moz-columns: 2;\n    height: 100px !important;\n}\n\n/***DISTANCE BETWEEN MENU ELEMENTS***/\nnav.standard ul li {\n    padding-bottom: 15px !important;\n}\n\n/***STYLING MENU ITEMS***/\n.navPrimary a {\n    background-image: linear-gradient(to bottom, #252526, #252526);\n    background-position: left 0 bottom 0;\n    background-repeat: repeat-x;\n    background-size: 2px 1px;\n}\n
Run Code Online (Sandbox Code Playgroud)\n\n

我的 …

css

5
推荐指数
1
解决办法
2736
查看次数

SVG 被扭曲

我正在尝试在我的网站上嵌入几个 .svg 文件。只要我使用 Chrome、Firefox 或迄今为止我测试过的任何移动浏览器,一切似乎都能正常工作。但是,有一个例外:每当我在 Windows Phone (Internet Explorer Mobile) 上查看 svg 时,图像都会失真。

我想我已经找到了这种行为的原因:因为我希望任何 svg 的大小都是可变的,所以我给了它们一个基于百分比的宽度和一个自动高度。如前所述,这适用于大多数浏览器。然而,Internet-Explorer 似乎忽略了 height:auto 从而将 svg 拉伸到它的最大高度。

也就是说,一种解决方案是为每个 .svg 分配固定尺寸。但这会牺牲响应式设计的想法。

有没有人知道问题可能是什么?

哦,这是我网站页面的链接,其中包含一个 svg(黑色“星”表示“选择”):

http://alexanderschlosser.de/select.html

提前谢谢了!亚历克斯

编辑:这是嵌入式SVG之一的代码。

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="90px" height="90px" viewBox="0 0 90 90" enable-background="new 0 0 90 90" xml:space="preserve">
<path fill="#E64132" d="M45,87.25C21.703,87.25,2.75,68.297,2.75,45S21.703,2.75,45,2.75S87.25,21.703,87.25,45
    S68.297,87.25,45,87.25"/>
<path fill="#FFFFFF" …
Run Code Online (Sandbox Code Playgroud)

html css internet-explorer svg

2
推荐指数
1
解决办法
5853
查看次数

标签 统计

css ×2

html ×1

internet-explorer ×1

svg ×1