CSS not working on every element
Here's my CSS:
<style type="text/css">
.leftRightBorder select,
.leftRightBorder textarea,
.leftRightBorder input[type=text]
{
width: 150px;
margin-bottom: 5px;
}
</style>
Here's the top portion of my page as an image:
The CSS styles/spaces/lengths (is that a word) everything on the page beautifually, but this top section is still weird, the maturity date two dropdowns, and value date is a little weird too. Here is the ASP for this top section:
<tr id="tr14">
<td id="td15">
<%= Html.LabelFor(m => m.MaturityDate) %>
</td>
<td id="td16" style="width: 150px;">
<%= Html.TextBox("MaturityDate", Model.MaturityDate.HasValue ?
Model.MaturityDate.Value.ToString("dd-MMM-yyyy") : "",
new { @class = "economicTextBox", propertyName = "MaturityDate",
onchange = "parseAndSetDt(this); ", dataType = "Date" })%>
<%= Html.DropDownListFor(m =>
m.AmortizationComponent.MaturityBusinessDayConvention,
DropDownData.BusinessDayConventionList(), "",
new { propertyName =
"AmortizationComponent.MaturityBusinessDayConvention",
onchange = "UpdateField(this);" })%>
</td>
<td id="td17" style="width: 76px">
Value Date
</td>
<td id="td18" 开发者_运维知识库style="width: 150px">
<%= Html.TextBoxWithPermission("RateTimeStamp",
Model.RateTimeStamp.HasValue ?
Model.RateTimeStamp.Value.ToString("dd-MMM-yyyy") : "",
new string[] { PERMISSIONS.hasICAdvanced },
new { @class = "economicTextBox", propertyName = "RateTimeStamp",
onchange = "parseAndSetDt(this);", dataType = "Date" })%>
<br />
<%= Html.CheckBoxForWithPermission(m => m.Current,
new string[] { PERMISSIONS.hasICAdvanced },
new { @class = "economicTextBox", propertyName = "Current",
onchange = "UseCurrent();UpdateField(this);" })%>
Current
</td>
</tr>
Why isn't this part being styled effectively?
CSS doesn't work on every input element the same way in every browser. In IE, most of the inputs are still drawn by Windows Forms so they are not quite CSS compliment. But in Chrome and Firefox everything works for the most part, but you may have to tweak the margins and size specifically for the select
element.
And if you want to support the Mac, you really need to forget about the sizing, because the Apple OS decides to do it's own thing regardless of settings, sort of the same problem I mentioned above with IE.
Don't become overly anal about this, because at this point in history you can't control every aspect of the input in the same way, and you are going to drive you self crazy if you try to. Things are getting better with the browsers specifically IE 9, but don't hold your breath that they will work how you want.
Note I also have assumed it is in oversight, but leftRightBorder
doesn't show up anywhere in the code you posted. I am making the assumption the problem you are posting about isn't as simple as forgetting the class.
精彩评论