CSS: Is it correct that text content of a div overflows into the padding?

前端 未结 7 1301
傲寒
傲寒 2021-01-30 10:55

I expected that the padding inside a div would remain clear of any text. But given the following html/css, the content-text spills out into the padding;

7条回答
  •  挽巷
    挽巷 (楼主)
    2021-01-30 11:36

    I just ran into this issue as well and don't like the way it works. No matter how large the cat gets, the padding will always be between it and the box! Therefore, when using overflow: hidden, the content should be hidden when it reaches the padding.

    Here's a hack that doesn't work in case you want a border, but might for some (me): use the borders as padding.

    helloworld
    .foo { float: left; overflow: hidden; background: red; padding-right: 0; /* Removed the padding. */ width: 50px; border-right: 10px solid red; /* 10px, background color or transparent. */ box-sizing: border-box; /* I prefer this one too.. */ }

提交回复
热议问题