Html 浮动上的填充不为0：右_Html_Css

Html 浮动上的填充不为0：右

html css

Html 浮动上的填充不为0：右,html,css,Html,Css,我试图让一个图像在一个DIV上一直运行，但它没有发生：\ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> &

我试图让一个图像在一个DIV上一直运行，但它没有发生：\

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style>* { margin:0;padding:0; }
#login {
background:red;
width:200px;
xpadding:5px;
}
#login a, #login a:visited {
color:blue;
text-decoration:none;
font:12px verdana;
}
</style>
    <title>Untitled 1</title>
</head>

<body>



<div id="login"><div style="float:right;margin-right:5px;"><img src="https://si0.twimg.com/sticky/default_profile_images/default_profile_0_normal.png" /> </div>

<div style="float:right;color:red;text-align:right;"><a href="#">@Testing</a><br /><a href="?wipe=1">Logout</a></div>
<div style="clear:both;"></div></div>

</body>
</html>


*{边距：0；填充：0；}
#登录{
背景：红色；
宽度：200px；
xpx:5px；
}
#登录a，#登录a:已访问{
颜色：蓝色；
文字装饰：无；
字体：12px verdana；
}
无标题1

试穿一下，说。。。当红色应该一直向右浮动时，在边框的右侧仍然可以看到红色。

浮动的样式属性中有“margin right:5px；”。这会导致右边出现5像素的边距。。。如果你移除它，它会一直向右移动

您要求使图像在div上一直向右移动，但您没有说是哪个div。img在其直接父级上已经一直向右移动，但该div距离其父级（“登录”）右侧有5个像素。

右边距：5px取下

右边距：5px

在图像周围的内部

DIV

上

将图像div中的边距设置为0，将使图像完全覆盖

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style>body { margin:0;padding:0; }
#login {
background:red;
width:200px;
xpadding:5px;
}
#login a, #login a:visited {
color:blue;
text-decoration:none;
font:12px verdana;
}
</style>
    <title>Untitled 1</title>
</head>

<body>



<div id="login"><div style="float:right;margin-right:0px;"><img src="https://si0.twimg.com/sticky/default_profile_images/default_profile_0_normal.png" /> </div>

<div style="float:right;color:red;text-align:right;"><a href="#">@Testing</a><br /><a href="?wipe=1">Logout</a></div>
<div style="clear:both;"></div></div>

</body>
</html>


正文{margin:0；padding:0；}
#登录{
背景：红色；
宽度：200px；
xpx:5px；
}
#登录a，#登录a:已访问{
颜色：蓝色；
文字装饰：无；
字体：12px verdana；
}
无标题1

像这样做：

<div id="login"><div style="float:right;padding-left:10px;"><img src="https://si0.twimg.com/sticky/default_profile_images/default_profile_0_normal.png" /> </div>

我不能完全满足您的需要，因为在这里，我认为代码完全实现了它应该实现的功能。所有内容都在

login

div中，该div是200px，因此所有内容都在200px宽度内。而

float:right

将其浮动到divremove margin right:5px的最右侧+1，尽管这与我的答案相矛盾。我最喜欢这个答案的措辞。+1给你们三个人，首先是正确的答案。我不得不玩弄它来找到它。@Jahkr：这里的每个人都一次又一次地犯了这样的错误，新鲜的眼睛是发现显而易见的东西的好方法。生活和学习，以及所有这些。@mu太短了哈哈，没意识到体育精神是一个徽章。我应该经常这样做；）