Dushyant Patel’s Blog

CSS issue Input width=100% & padding in IE issue

I was having a problem with width on input[text] fields in IE

In IE, it renders the width as 100% + 10px(padding which i have given for search icon).

HTML:

<div class=”container”>
<input type=”text” value=”Enter Keyword” name=”searchbox”/>
</div>

<div class=”button_div”>
<input type=”submit” name=”button” id=”button” value=”Search” />
</div>

CSS:

.container{ width:250px; float:left}
.button_div {width:100px; float:right}
.container input{ width:100%; max-width:100%; padding-left:10px;}

Soltuion:
Wrap the input field with a 100% div with no padding and no margin and set the input field inside that div to 100% width with a padding of 10px

<div class=”container”>
<div style=”width:100%”>
<input type=”text” value=”Enter Keyword” name=”searchbox”/>
</div>
</div>

Advertisements

Filed under: Technology

Beyond Compare is the ideal tool for comparing files and folders

I would like to share one good software with you all, for comparing files and folders.

Beyond Compare provides users with extensive side-by-side file comparison and management. Synchronize files between laptop and PC, home and office, etc. Compare directory trees side-by-side with mismatches highlighted. Display text files side-by-side with changes highlighted. Great for merging changes to source code.

Website Link : http://www.scootersoftware.com/index.php

Filed under: Technology, ,

September 2009
M T W T F S S
« Jul   Oct »
 123456
78910111213
14151617181920
21222324252627
282930  

My Twitter

Error: Twitter did not respond. Please wait a few minutes and refresh this page.

del.icio.us bookmarks

Blog Stats

  • 23,212 hits