Home/ Questions/Q 8678225
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T20:39:41+00:00

I have two html code. In first code background is not coming. But In

  • 0

I have two html code. In first code background is not coming. But In second code when i put clear:both; code then background is coming. Can you have any alternative easy option to show background instead of height. I dont want to put height and extra div structure.

First Code:- 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<!-- please dont use height in background -->
<body>
<div style="background:#990000;">
<div style="float:left;">left part</div>
<div style="float:right">right part</div>
</div>
</body>
</html>

Second Code:- 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<!-- please dont use height in background -->
<body>
<div style="background:#990000;">
<div style="float:left;">left part</div>
<div style="float:right">right part</div>
<div style="clear:both"></div>
</div>
</body>
</html>

Your kind revert shall be highly appriciated. Thanks in Advance.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Hi now there are many option clear to parent div if you used floating

    as like this first is 

    .mainclear{
background:#990000;
}

.mainclear:after{
content:'';
  clear:both;
  overflow:hidden;
  display:block;
}

    secound is 

    .mainclear{
background:#990000;
  overflow:hidden;
}

    your html code 

    <!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<!-- please dont use height in background -->
<body>
<div class="mainclear">
<div style="float:left;">left part</div>
<div style="float:right">right part</div>
</div>
</body>
</html>

    Demo first

    ———\

    Demo Second

    • 0