我想设置元素position来absolute和有一个margin-bottom,但似乎margin-bottom没有效果.
HTML:
<div id='container'></div>
Run Code Online (Sandbox Code Playgroud)
CSS:
#container {
border: 1px solid red;
position: absolute;
top: 0px;
right: 0px;
width: 300px;
margin-bottom: 50px; // this line isn't working
}
Run Code Online (Sandbox Code Playgroud) 我当然是初学者,但在发布之前我也进行了大量的搜索.我的div元素周围似乎有额外的空间.我还想指出我尝试了很多边框组合:0,填充:0等等,似乎没有任何东西摆脱白色空间.
这是代码:
<html>
<head>
<style type="text/css">
#header_div {
background: #0A62AA;
height: 64px;
min-width: 500px;
}
#vipcentral_logo { float:left; margin: 0 0 0 0; }
#intel_logo { float:right; margin: 0 0 0 0; }
</style>
</head>
<body>
<div id="header_div">
<img src="header_logo.png" id="vipcentral_logo">
<img src="intel_logo.png" id="intel_logo"/>
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
这就是它的样子(我插入红色箭头以明确地调出额外的空间):

我期待蓝色直接与浏览器边缘和工具栏相邻.这些图像都是64像素高,并且具有与分配给#header_div的图像相同的背景颜色.任何信息将不胜感激.
我想移动矩形对象的动画以在x轴上移动它.我是WPF动画的新手,从以下开始:
<Storyboard x:Key="MoveMe">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="GroupTileSecond"
Storyboard.TargetProperty="(**Margin.Left**)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="**134, 70,0,0**" />
<SplineDoubleKeyFrame KeyTime="00:00:03" Value="**50, 70,0,0**" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
Run Code Online (Sandbox Code Playgroud)
很明显发现,我不能使用Margin.Left的Storyboard.TargetProperty或使用134,70,0,0的Value属性.
那么,如何在XAML WPF中移动对象.
Bootstrap是否有内置的填充和边距类pad-10,mar-left-10或者我必须添加自己的自定义类?例如,类似于那些在这里的空白和边距选项卡.
我在这里去香蕉,不知怎的,在我的页面中我的所有图像下面都有一个间隙,代码中没有边距.甚至Firebug都看不到它,但Firefox和Safari正在渲染它 - 即使没有CSS也没有!
从来没有发生在我身上......!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Paranoid</title>
<link rel="stylesheet" href="includes/style.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="sidebar">
<img src="images/logo.png" id="logo" />
<ul id="menu">
<li class="menu1">Main</li>
<li class="menu1">System</li>
<li class="menu1">View</li>
<li class="menu1">Policy</li>
</ul>
<div id="sidebar_bottom"></div>
</div>
<div id="main_content"></div>
<div class="clear"></div>
</div>
</body>
</html>
body{
background: #497e9f url(../images/bg.png) repeat-x top;
}
#container{
width:864px;
margin: 8px auto 0 auto;
}
#sidebar{
/*width:139px;*/
float: left;
}
#sidebar_bottom{ …Run Code Online (Sandbox Code Playgroud) 我遇到过一个案例,我需要一个孩子的边距来扩展父容器.我发现父分区外的空间已分配,但父分布本身并未扩展.然后我发现通过向父母添加`overflow:hidden'我可以解决这个问题.
任何人都可以解释为什么会这样吗?
更新:
我发现向父级添加任何填充或边框值也会修复此问题.
新的Bootstrap 3网格系统非常棒.它在所有屏幕尺寸的响应式设计中功能更强大,嵌套更容易.
但我有一个我无法弄清楚的问题.如何在列之间添加精确的间隙?假设我有容器960px,310px的3列和3列之间的15px的2个gutters.我怎么做?
我有这个样式表:
*{
padding: 0px;
margin: 0px;
}
a{
background:yellow;
}
Run Code Online (Sandbox Code Playgroud)
和这个网页:
<a href="/blog/">Home</a>
<a href="/about/">About</a>
<a href="/contact/">Contact</a>
Run Code Online (Sandbox Code Playgroud)
结果是:
如何让这些锚标签相互"接触",消除其间不需要的空间?
谢谢卢卡
我需要将检查放在我的imageview的右上角.但是当我这样做时,我发现我的复选框周围有一个默认的边距.有没有办法删除这个?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageView
android:id="@+id/thumbImage"
android:layout_width="100dp"
android:layout_height="132dp"
android:layout_gravity="center" />
</FrameLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#ff0000"
android:gravity="center" >
<CheckBox
android:id="@+id/itemCheckBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_gravity="center"
android:button="@drawable/checkbox_background"
android:paddingLeft="0dp"
android:paddingTop="0dp" />
</LinearLayout>
</RelativeLayout>
Run Code Online (Sandbox Code Playgroud) 我有一个非常简单的文档(另见JSFiddle):
<style>
html, body, svg, div {
margin: 0;
padding: 0;
border: 0;
}
</style>
<body>
<svg id="foo"
xmlns="http://www.w3.org/2000/svg"
version="1.1"
style="width: 768px; height: 1004px;">
</svg>
</body>
Run Code Online (Sandbox Code Playgroud)
由于某种原因,该svg元素的底部边距为3px或4px(即,该body元素的高度为1007px,1008px甚至1009px; svg使用浏览器调试工具检查时,边距本身为0.)
如果我svg用a 替换div,则虚假边缘消失.Opera 12,Chrome 33,Firefox 26和Internet Explorer 11的行为是一致的,所以我确信这种行为符合设计和标准,我只是不明白.