HTML input element wider than Containing Div

Following code is not working

<div style="height:25px; width: 150px;">
     <input type="text" style="height:100%; width:100%"  />

You can use box-sizing:border-box to take care of this. Just put the following in your css file:


It means that border on the input box is actually inside the width of the input rather than being added onto the outside. This is what is making the input larger than the container.

Paul Irish has really good post explaining this technique

The points he makes about padding also apply for the border.

There’s even a compass mixin to make it easier to support older browsers. (

How to export HTML Table into Excel via PHP

Create one variable and save whole table as string to that variable and just add below headers lines

//Header information
$header = "Header1" . "\t";
$header .= "Header2" . "\t";

//Reading the data thro' POST
$data= $_POST['header1']. "\t";
$data .= $_POST['header2'] . "\t";

header("Content-type: application/x-msdownload");
header("Content-Disposition: attachment; filename=xyz.xls");
header("Pragma: no-cache");
header("Expires: 0");
print "$header\n$data";

download sample file