标签: width
100%宽度div不跨越webkit中浏览器的整个宽度
对于我认为是一个死的简单问题,我很难过.
我正在尝试创建一个跨越浏览器窗口宽度100%的div.div中充满了几个子div,这些div扩展为用足球场等交替颜色填充整个空间.这些div将扩展到适合给定空间的整个宽度,该空间具有单独的1%条纹,完全填充该空间.
这似乎在Firefox中运行良好,但在Safari(和Chrome)中,计算似乎过于严格,并在最右边的div上留下了一些额外的剩余空间.
有没有办法避免这个剩余的空间？我在Safari和Chrome中遇到了同样的问题,即使把它放在一个固定宽度的div中......右边总是留有空间.我想知道我是否只是要求它做太多的数学运算？
这是我正在使用的代码,备用版本将空间划分为5%的分区和1%的分区.对不起,这是冗长而冗余的代码.
<html>
<head>
<style type="text/css">
<!--
body {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
.clearfix {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
#field {
width: 100%;
background: #009900;
height: 100px;
margin: 0;
margin-bottom: 25px;
padding: 0;
}
.singleyard {
width: 1%;
float: left;
margin: 0;
padding: 0;
background: #009900;
}
.fiveyards {
width: 5%;
float: left;
margin: 0;
padding: 0;
} …推荐指数
解决办法
查看次数
宽度:100%,位置:绝对(css)
如果你这样做:
<div style="width: auto; background: red; color: white">test</div>
你得到一个拉伸的div来填充整个屏幕宽度(100%).
这就是我需要发生的事情.
但是,我还需要设置起始位置..所以我需要位置:绝对.
当我添加position:absolute时,div的宽度仅与内容中的内容一样宽.(类似于浮点数).有没有办法解决？
我不能简单地指定宽度:100%,因为这不考虑边框大小等.
谢谢,韦斯利
推荐指数
解决办法
查看次数
CSS:在表格上设置最大宽度
我正在用html生成应用程序日志,我偶然发现了一个相当恼人的问题.我有以下布局:
| Action | Result | File path |
例如
| Copy | Success | C:\VeryVeryVeryLongF |
| | | ileName.txt |
第1列和第2列仅显示短标签:其内容应保留在一行中.另一方面,第3列可能包含非常长的文件路径,如果它们不能适合单行,则应该跨越多行.
为了达到这个目的,我已经white-space: nowrap;在第一列和white-space: normal; word-break: break-all;最后一列使用了.此外,该表有width:100%.
这在Chrome和IE中很有用,但在Firefox中却不行:简而言之,我似乎无法找到一种方法来告诉Firefox 8.0不要放大表格的最后一列,而是让文本跨越多行.在我之前的例子中,Firefox打印
| Copy | Success | C:\VeryVeryVeryLongFileName.txt |
前两列中的文本可能会有所不同,因此我无法手动设置其宽度并使用table-layout: fixed.我也试过max-width在桌子上设置,并将其包装成一个div,但无济于事.
请参阅http://jsfiddle.net/GQsFx/6/获取真实示例=)如何让Firefox像Chrome一样？
推荐指数
解决办法
查看次数
Qt - 获取QLabel中字符串的像素长度
我有一个固定宽度的QLabel.
我需要(定期)检查整个字符串是否适合当前宽度的QLabel内部,因此我可以适当调整它的大小.
为此,我需要获取字符串的"像素长度".
(显示字符串所需的水平像素总数).
应该注意的是,QLabel的点大小永远不会改变.
我不能简单地检查存在的字符数量,因为有些字符是下标/上标,并且对整个字符串的宽度有不同的贡献.
(这就是说像素宽度和字符数量之间没有简单的关系)
这有什么抽象的,超级便利的功能吗？
规格:
Python 2.7.1
PyQt4
Windows 7
推荐指数
解决办法
查看次数
WPF DataGrid列宽度自动和滚动条
我有一个包含许多列的DataGrid.
Width="Auto"如果窗口比所有列都窄,我想用滚动条显示所有内容.如果窗口更宽,我希望列跨越空白区域,因此没有死区.
基本上我希望列最小宽度完全适合内容或标题.如果窗口更宽,则扩大到更大.
推荐指数
解决办法
查看次数
绝对位置影响宽度？
我是css的新手.我想知道为什么当我将div元素的位置更改为绝对时,div元素的宽度会发生变化？在Chrome v25.0.1364.172m和IE9中尝试过,两者都有相同的结果.
简单的例子:
<!doctype html/>
<html>
<head>
<title>test</title>
<style>
div {
position:relative;
border-width: 1px;
border-style: solid;
border-color: black;
}
</style>
</head>
<body>
<div>test</div>
</body>
</html>
推荐指数
解决办法
查看次数
Vimeo全宽
我正在尝试在网页中显示全宽的vimeo视频.
这就是它现在的样子:
你可以看到黑色是全宽而不是视频.它应该是全宽,没有显示控件,自动播放和循环播放.
我的代码现在看起来像这样:
<iframe src="https://player.vimeo.com/video/208176323?autoplay=1&loop=1&background=1" width="100%" height="500px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
客户端有vimeo plus但不是vimeo pro.有人可以帮我弄这个吗.
更新:
我已将代码更改为:
<style>
.embed-container {
position: relative;
padding-bottom: 56.25%;
height: 0; overflow: hidden;
max-width: 100%; height: auto;
}
.embed-container iframe, .embed-container object, .embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
<div class='embed-container'><iframe src='https://player.vimeo.com/video/208791851?autoplay=1&loop=1&background=1' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>
但我仍然在底部和顶部有黑色边框.
我已经创建了一个jsfiddle,你也可以看到这个:https://jsfiddle.net/07fkfwz3/ .你在这里看到的视频没有任何边框.
推荐指数
解决办法
查看次数
有没有办法设置<input type ='file'/>的宽度以便在Firefox中显示？
所有CSS属性都适用于不适用于<input type='file'/>FF,但适用于大多数其他浏览器.
只是无法设置宽度.有解决方案吗 请不要JS.
推荐指数
解决办法
查看次数
在父级100%宽度内设div,而不是父div
我想让我的内部div 100%宽度的身体,而不是100%的父div.这可能吗？
布局如下所示:
<body>
<div> /** Width:900px; **/
<div> /** This I want 100% of BODY, not of parent div **/
</div>
</div>
</body>
推荐指数
解决办法
查看次数
如果内容字符串宽度大于ListBox宽度,则将DotNet ListBox项目Winforms自动换行？
嗯,嗯,这意味着有些线条应该是两行的.我的老板认为这是更简单的解决方案,而不是限制显示的文字以适应宽度而不喜欢水平滚动条> _ <
推荐指数
解决办法
查看次数