标签: width
获取DIV宽度和高度的跨浏览器方法？
这是我的第一篇文章,所以请放轻松我.我确定我做错了什么.但是,我找不到任何回答上述问题的帖子.
我使用jQuery.我正试图找到一种方法来获取DIV元素的当前宽度和高度,即使它们被设置为"自动".我发现了很多方法,但没有方法在IE中返回相同的宽度.重要的是这种方法是跨浏览器的,因为如果在不同的浏览器中返回不同的数字,它将破坏页面的布局.
.width()和.height()不起作用,因为在IE中,减去了填充(例如,width()返回25,其中宽度为30,填充为5).
.outerWidth()和.outerHeight()也不一致.当他们在FF中工作IE(信不信由你)时,填充再次添加到整个宽度(例如,outerWidth()在FF中返回110,其中宽度为100px,填充为10px).
没有编写复杂的浏览器检查,有没有办法解决这个问题？谢谢!
推荐指数
解决办法
查看次数
HTML/CSS:将float-left元素扩展为parent的剩余宽度
对于我的生活,我无法弄清楚这一点.我有一个特定宽度的容器div.里面有几个孩子.我希望最后一个div扩展其宽度以填充容器中剩余的剩余宽度.我怎样才能做到这一点？
这是一个例子(也在http://jsfiddle.net/nbKAr/):
#container {
width:200px;
border: 1px solid red;
}
#container div {
float:left;
border: 1px solid black;
}<div id="container">
<div>a</div>
<div>b</div>
<div id="expandMe">expand me</div>
</div>假设带有"a"和"b"的div组合总宽度为50px.如何在不使用JavaScript的情况下制作#expandMe 150px？
推荐指数
解决办法
查看次数
iPad和iPhone上的浏览器宽度不是100%,其余的都可以
出于测试目的,我设置了这个页面:http://www.fondationmartinmatte.com/test.html
它在html桌面浏览器中非常好,但在移动设备中总是有一个垂直的灰色栏来自地狱.来自哪里以及我应该告诉html代码用于移动设备的设置.首先是那个代码:<meta name="viewport" content="width=device-width">这使整个事情变得更糟.我只是删除它,这是灰色栏.如何解决这个问题,提前谢谢
推荐指数
解决办法
查看次数
子div将扩展为父div的全宽度,并在同一行中使用css
<style>
.classname {
min-width:248px;
height:40px;
max-width:498px;
border:1px solid red;
float:left;
}
</style>
<div id="maindiv" style="width:3134px;border:1px solid green;height:90px;">
<div class="classname">
</div>
<div class="classname">
</div>
<div class="classname">
</div>
</div>
所以无论我有多少个孩子,maindiv我都希望他们扩展到父宽度大小的全尺寸.例如:如果maindiv的宽度为1200px,则每个400px的孩子如果是3或300px,如果是4只CSS解决方案
推荐指数
解决办法
查看次数
如何使相对宽度的div居中？
我有一个<div>风格如下:
.content{
width: 70%;
}
为了使div居中,可以将余量设置为auto(margin: 0 auto;),但这只有在我有固定大小(例如400px)时才有效.那么我如何以相对宽度居中我的div？
推荐指数
解决办法
查看次数
在c中找到int的位宽; 最佳跨平台方法
我需要知道正在运行我的代码的系统中的本机int的宽度(大小),以位为单位.
我可以使用"sizeof"来获取chars中的宽度,但是,据我所知,C规范中没有任何地方可以为char分配特定的位数.
那么找到int的位宽的最佳跨平台方法是什么？
推荐指数
解决办法
查看次数
SVG <g>和<text>元素的默认宽度/边距/填充是多少？
我正在处理以下SVG文件. http://jsfiddle.net/slayerofgiants/9y3qc/8/
如果您从小提琴文件中注意到,水平滚动条延伸到SVG绘图宽度的大约两倍.除了SVG的边缘之外,只有白色空间.如果我删除了<g>和<text>元素,那么水平滚动条会消失,并且是屏幕宽度的大小.
你可以在这个第二个jsfiddle上看到这个 http://jsfiddle.net/slayerofgiants/m5zPv/
下面的代码是SVG,没有g包含配对text元素的元素.
<svg version="1.1" width="90%" id="ex1-3rds-quarter-s" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" viewBox="0 0 323.333 55.333" enable-background="new 0 0 323.333 55.333"
xml:space="preserve" preserveAspectRatio="xMinYMid meet">
<font horiz-adv-x="1000">
<g id="fullTAB" transform="scale(1.1,1)" >
<g id="tablines" display="block">
<line fill="none" id="lowE" stroke="#000000" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" x1="6" y1="45" x2="262" y2="45"/>
<line fill="none" id="Astring" stroke="#000000" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" x1="6" y1="38.5" x2="262" y2="38.5"/>
<line fill="none" id="Dstring" stroke="#000000" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" x1="6" y1="32" x2="262" y2="32"/>
<line fill="none" id="Gstring" stroke="#000000" …推荐指数
解决办法
查看次数
Flex容器内的块元素被挤压.但为什么？
我想知道为什么flex div中的8个内联块元素被挤压并且不遵守它们的设置(宽度:50px).
http://codepen.io/anon/pen/YXJOwe?editors=110
<style>
div
{
display: flex;
justify-content: center;
border: 1px solid red;
width: 150px;
overflow: auto;
}
a
{
display: inline-block;
background:orange;
width: 50px;
height: 50px;
margin: 10px;
}
</style>
<div>
<a>1</a><a>2</a><a>3</a><a>4</a><a>5</a><a>6</a><a>7</a><a>8</a>
</div>
推荐指数
解决办法
查看次数
使一组按钮填充父div的整个宽度
我有一个小面板，宽度为360px。面板顶部有一个导航栏，该导航栏当前包含3个按钮（不过，数字并不重要）。我希望按钮填充div的整个宽度，并根据内部单词的长度占用更多或更少的空间。目前，我只知道如何将按钮的宽度设置为一个值，但是如果我添加一个按钮，则需要手动更改这些值。
这就是我现在所拥有的，但是显然看起来很可怕。如何使第一个按钮的宽度减小，第二个按钮的宽度变宽并使所有三个按钮一起占据面板的整个宽度？
这是我的代码：
HTML：
<!DOCTYPE html>
<html>
<head>
<title>TEST</title>
<link type="text/css" rel="stylesheet" href="test.css"/>
</head>
<body>
<div class="panel">
<ul class="nav">
<li class="buttons">SHORT</li>
<li class="buttons">LOOOOOOOOOOONG</li>
<li class="buttons">...</li>
</ul>
</div>
</body>
</html>
CSS：
.panel {
background-color: grey;
width: 360px;
height: 600px;
position: relative;
border: 1px solid black;
}
.nav {
padding: 0;
margin: 0;
}
.buttons {
float: left;
display: block;
padding: 0px 20px;
height: 40px;
width: 60px;
background-color: #666666;
border-right: 1px solid black;
border-bottom: 1px solid black;
text-align: center;
line-height: 40px; …推荐指数
解决办法
查看次数
Xaamrin窗体的下划线时BoxView宽度太长
我正在使用BoxView完成我的应用程序中的下划线。我有几个非常短的标签-诸如“是”或“否”之类的文本。这是其中一个带有BoxView的标签的XAML下划线：
<StackLayout Orientation="Vertical" Grid.Row="5" Grid.Column="1" Margin="0,4,0,4" HorizontalOptions="Start" BackgroundColor="Purple" MinimumWidthRequest="1">
<Label x:Name="txtUseMetric" TextColor="Blue" FontSize="Small" Text="{Binding UseMetricText}" BackgroundColor="Yellow">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="Value_Tapped" CommandParameter="usemetric" />
</Label.GestureRecognizers>
</Label>
<BoxView BackgroundColor="Green" HeightRequest="1" MinimumWidthRequest="1" />
</StackLayout>
我的问题是BoxView的宽度始终超出我尝试覆盖App.Xaml文件中的MinWidthRequest的文本，如下所示：
<Style TargetType="BoxView">
<Setter Property="MinimumWidthRequest" Value="3" />
</Style>
但这没有效果。我提供了屏幕截图供您查看。
仅供参考-黄色是标签的宽度。您不会看到任何紫色（StackLayout的背景色），因为StackLayout和Label的宽度相同。第二个屏幕快照显示了如果删除BoxView，屏幕的外观-即Label和StackLayout的大小正确。
对于如何解决这个问题，有任何的建议吗？
BoxView太长的屏幕截图，使标签和StackLayout太长
屏幕截图删除了BoxView，并且正确调整了标签和堆栈布局
推荐指数
解决办法
查看次数