[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 630
  • Last Modified:

alignment problem of hidden input field inside a <td> in IE

Hi,

I am using a RadDatePicker  in my application and I put it inside a table. But it does not look the same on firefox and ie7. Here is the image as it apprears on IE7: http://i62.photobucket.com/albums/h116/ikaruga7/table.jpg

As I noticed, the spaces (above and below) each textfield are caused by the hidden fields. I attached here a sample code I created which demonstrate this issue. Please try to look them on IE7 and firefox to see what I mean. I am also attaching here the css of the table's td.


Sample Code:
=========
asd
<table>
<tr>
<td><input style="visibility: hidden;display:block; float:right;margin:0;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="RadDatePicker_Compare_From_Start_Date" name="RadDatePicker_Compare_From_Start_Date" type="text" value="2003-05-01" /><span id="RadDatePicker_Compare_From_Start_Date_dateInput_wrapper" class="radInput_Office2007"><input id="RadDatePicker_Compare_From_Start_Date_dateInput_text" class="radEnabledCss_Office2007" style="width:62px;" /><input style="visibility:hidden;float:right;margin:-18px 0 0 0;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="RadDatePicker_Compare_From_Start_Date_dateInput" name="RadDatePicker_Compare_From_Start_Date$dateInput" type="text" value="2003-05-01-00-00-00" /><input id="RadDatePicker_Compare_From_Start_Date_dateInput_ClientState" name="RadDatePicker_Compare_From_Start_Date_dateInput_ClientState" type="hidden" /></span>
</td>
</tr>
</table>
asd
=========
 
 
TD CSS:
=========
font-family: Verdana, Geneva, ms sans serif;
font-size: 10px;
font-weight: bold;
white-space: nowrap; 
vertical-align: middle;
text-align: left;
padding: 2px 4px 2px 4px;
=========

Open in new window

0
JaimeJegonia
Asked:
JaimeJegonia
1 Solution
 
crush83Commented:
input#RadDatePicker_Compare_From_Start_Date_dateInput_ClientState {
  display: none;
}

^ try this I guess.
0
 
scrathcyboyCommented:
in CSS --

INPUT.text  {  padding:0px; margin:0px; border:0px }

that should equalize IE and FF display positioning.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now