Home/ Questions/Q 633455
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T20:11:17+00:00

In IE7 I’d like to add some margin to a element that has 100%

  • 0

In IE7 I’d like to add some margin to a element that has 100% width of it’s parent. But the element overflows it’s parent. Somewhat logical, but what’s a solution to this problem?

I added a simplified example, where the yellow div overflows it’s green parent.

<!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" >
<head><title>Test</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /></head>
<body>

<div style="width: 500px; height: 200px; background-color: green;">
 <div style="width: 100%; height: 100%; margin: 10px ; background-color: yellow;">
  Test
 </div>
</div>

</body>
</html>

Thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you just remove the width: 100%; declaration you’re all set:

    <div style="width: 500px; height: 200px; background-color: green;">
 <div style="height: 100%; margin: 10px ; background-color: yellow;">
  Test
 </div>
</div>

    The default behavior is to stretch to the full width of the container.

    • 0