2016-12-10 45 views
1

CSS如何风格忽视其母公司的填充的元素?

div { 
    padding: 20px; 
} 

HTML

​​

有没有办法有button忽略填充和拥抱父母div的右上角,在不影响p周围的20像素?

我觉得也许有什么东西我可以用position属性做,但是从我的简短的研究,它似乎并没有做我想做的。

回答

4

您可以使用位置,或切缘阴性:

位置:

div { 
    padding: 20px; 
    position: relative; 
} 
div button { 
    position: absolute; 
} 

负保证金:

div { 
    padding: 20px; 
} 
button { 
    margin: -20px 0 0 -20px; 
} 
1
button { 
    position: relative; 
    left: -20px; 
    top: -20px; 
} 

JSFiddle

1

Tr的Y本:

* { 
 
    margin: 0px; 
 
    padding: 0px; } 
 
\t \t 
 
div { 
 
    padding: 50px; 
 
    background: yellow; 
 
    position:relative; } 
 
\t \t 
 
div p { 
 
    background: green; 
 
    position: absolute; 
 
    top: 0px; 
 
    left: 0px; }
<div> 
 
    <p>This is paragraph inside a div.</p> 
 
</div>