Questions tagged «css»

我有一个简单的Chrome扩展程序，该扩展程序使用内容脚本功能来修改网站。更具体地说，background-image所述网站。 由于某些原因，即使扩展中打包了本地图像，我似乎也无法使用它。 body { background: #000 url('image.jpg') !important; background-repeat: repeat !important; } 就是这样，最简单的CSS ...但是它不起作用。浏览器不会加载图像。

98 css  google-chrome-extension  background-image 

我使用了如下所示的CSS flex box布局： 如果屏幕变小，它将变为： 问题在于，无法调整图像的大小，从而保持原始图像的宽高比。 如果屏幕变小，是否可以使用纯CSS和弹性框布局来调整图像大小？ 这是我的html： <div class="content"> <div class="row"> <div class="cell"> <img src="http://i.imgur.com/OUla6mK.jpg"/> </div> <div class="cell"> <img src="http://i.imgur.com/M16WzMd.jpg"/> </div> </div> </div> 我的CSS： .content { background-color: yellow; } .row { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; flex-direction: row; -webkit-box-pack: …

98 html  css  flexbox 

.container { width: 850px; padding: 0; display: table; margin-left: auto; margin-right: auto; } .row { display: table-row; margin-bottom: 30px; /* HERE */ } .home_1 { width: 64px; height: 64px; padding-right: 20px; margin-right: 10px; display: table-cell; } .home_2 { width: 350px; height: 64px; padding: 0px; vertical-align: middle; font-size: 150%; display: table-cell; …

98 html  css 

以前，我的假设width: auto是将宽度设置为内容的宽度。现在，我看到它占据了父级的全部宽度。 谁能描述一下两者之间的区别？

98 html  css 

我认为使用Flexbox无法实现这一点，因为每一行只能是适合其元素的最小高度，但是可以使用更新的CSS Grid来实现吗？ 明确地说，我希望网格中所有行的所有元素的高度相等，而不仅仅是每行的高度都相等。基本上，最高的“单元格”应规定所有单元格的高度，而不仅仅是其行中的单元格。

98 css  flexbox  grid-layout  css-grid 

当文本是不带空格 和超过200像素的DIV大小它的流出宽度被定义为200像素我在这里把我的代码http://jsfiddle.net/madhu131313/UJ6zG/ 你可以看到图片下面的 编辑：我想文本转到下一行

98 css  border 

我有以下代码： <div style="float: left; width: 100%;"> <label style="float: left;">ABC</label> <input style="float: left; font-size: 0.5em;" type="button" onclick="addTiny(0,'Question_Text'); return false;" value="▼" title="Editor" /> <input style="float: left; font-size: 0.5em;" type="button" onclick="remTiny(0,'Question_Text'); return false;" value="▲" title="Hide" /> <div class="adm"> <textarea rows="2;" style="width: 100%" class="text-box multi-line mceEditor"> abc </textarea> </div> </div> 我的问题是类adm的div浮动到左侧，因此与label和两个输入按钮位于同一行。有什么方法可以使我从浮动转变呢？

98 css  html  css-float 

我正在React Native中创建一个表单，并希望使TextInput屏幕宽度达到80％。 使用HTML和普通CSS，这很简单： input { display: block; width: 80%; margin: auto; } 除了React Native不支持display属性，百分比宽度或自动边距。 那我该怎么办呢？有这个问题的一些讨论中作出反应原住民的问题跟踪器，但提出的解决方案似乎是讨厌的黑客。

98 javascript  css  reactjs  react-native 

最近我* *在CSS中遇到了。 网站参考- 网站链接。 对于*CSS样式表中的一种用法，Internet和Stack Overflow中充斥着示例，但是我不确定* *在CSS中使用两个符号。 我用Google搜索了它，但是无法找到与此相关的任何信息，因为它一次*选择了所有元素，但是我不确定为什么该网站使用了它两次。缺少的部分是什么？为什么使用此hack（如果是hack）？

97 html  css  css-selectors 

在此示例中，图像未居中。为什么？我的浏览器是Windows 7而非Google上的Google Chrome v10。 <img src="/img/logo.png" style="margin:0px auto;"/>

97 css  google-chrome  margin  centering 

我有两个div容器。 虽然一个需要为特定宽度，但我需要对其进行调整，以便另一个div占用其余空间。有什么办法可以做到吗？ .left { float: left; width: 83%; display: table-cell; vertical-align: middle; min-height: 50px; margin-right: 10px; overflow: auto; } .right { float: right; width: 16%; text-align: right; display: table-cell; vertical-align: middle; min-height: 50px; height: 100%; overflow: auto; } <div class="left"></div> <div class="right"></div> <!-- needs to be 250px --> 运行代码段隐藏结果展开摘要

97 css  html 

我在应用程序中使用textarea组件，并动态控制它们的高度。随着用户的键入，只要有足够的文本，高度就会增加。在IE，Firefox和Safari上运行良好。 但是，在Safari中，右下角有一个“句柄”工具，允许用户通过单击和拖动来调整文本区域的大小。我还在stackoverflow的“问问题”页面中注意到了textarea的问题。该工具令人困惑，并且基本上会妨碍您的工作。 因此，是否有隐藏此调整大小手柄的方法？ （我不确定“ handle”是否正确，但是我想不出一个更好的词。）

97 safari  webkit  css 

我目前正在使用Twitter Bootstrap 3，并且在创建响应图像时遇到了问题。我上过img-responsive课。但是图像尺寸没有扩大。如果我使用width:100%而不是，max-width:100%那么它运行完美。问题出在哪里？这是我的代码： <div class="col-md-4 col-sm-4 col-xs-12 "> <div class="product"> <div class="product-img "> <img class="img-responsive" src="img/show1.png" alt="" /> </div> </div> </div>

97 javascript  jquery  html  css  twitter-bootstrap 

如何使用CSS绘制虚线？

97 html  css 

我需要创建一个具有固定标题和固定第一列的html表（或类似外观的表）。 到目前为止，我所见过的每个解决方案都使用Javascript或jQuery设置scrollTop / scrollLeft，但在移动浏览器上无法正常运行，因此我正在寻找一种纯CSS解决方案。 我在这里找到了固定列的解决方案：jsfiddle.net/C8Dtf/20/，但我不知道如何增强它以使标头也固定。 我希望它可以在Webkit浏览器上使用或使用某些css3功能，但是我要重复一遍，我不想Javascript用于滚动。 编辑：这是我要实现的行为的示例：https : //web.archive.org/web/20130829032141/http : //datatables.net/release-datatables/extras/FixedColumns/css_size.html

97 html  css  html-table  markup  fixed-header-tables