I have a div inside a repeater (ItemTemplate) with the following markup
<div class="bottle listing">
Now for some reason this is being rendered as
<divclass="bottle listing">
Which breaks the page. This is only occurring infrequently and I haven't been able to nail down if it is only occurring in some browsers. Check out this site please:
http://www.myerwine.com.au/whites/chardonnay/4/16.aspx?page=2
I am viewing it in IE8, but I have been told this page is sometimes broken in Firefox and Chrome. When viewing the source in IE see line 415 "divclass="bottle listing"
Here is a portion of my repeater:
<asp:Repeater ID="repResults" runat="server" OnItemDataBound="repResults_DataBound">
<ItemTemplate>
<div class="row listing">
<div class="bottle listing">
............
</div>
</div>
</ItemTemplate>
</asp:Repeater>
Any ideas??
Actually the real answer was because I was using a White space filter and that in turn was removing spaces in the wrong places.
I added a second space
<div class="bottle listing">
And it fixed the problem, if anyone can explain why this solved the problem I would love to hear it.
Related
Hello guys I just started designing form with asp.net tags and would like to achieve what's on the image exactly. Thanks guy
If i understand you right, this is the code you need:
<asp:TextBox runat="server"></asp:TextBox><asp:TextBox runat="server"></asp:TextBox>
and the result:
Add some styles to make it pretty.
Blockquote
Here is the code with labels (you can also use asp labels):
<div style="display: inline-grid">
<asp:TextBox runat="server"></asp:TextBox><label>textbox1</label>
</div>
<div style="display: inline-grid">
<asp:TextBox runat="server"></asp:TextBox><label>textbox2</label>
</div>
and the result:
You can also put the style in the css.
I am writing code in ASP.NET.
I have a button that is clickable on IE but not on FF nor Google Chrome.
I've discovered that the reason lays on the fact that its position: absoulute OR position:fixed
Here's the code:
<div style="padding-top:50px";>
<div id="divInfoBox" runat="server" style="padding-top:5px; height:250px;">
<div style="position:fixed; padding-left:-5px; ">
<asp:ImageButton CssClass="attachmentImageButton" ID="btnAttachment" runat="server" Visible="false"
ImageUrl="~/Style/images/attachment.png" onclick="btnAttachment_Click" />
</div>
</div>
</div>
How to make it be clickable on all browsers?
My guess is that the first two div elements are on top of the ImageButton and therefore it is not clickable.
I have no clue why is that (be glad to find out the exact reason). All I know is that the solution is adding the following:
z-index:5
And that should do the trick.
Good luck
p.s.: if 5 isn't enough, try adding higher value.
I have a website that has a dojo TabContainer. I've been trying to upgrade the dojo library from 1.2 to the later versions.
At 1.5 I've run into a problem.
This is what the TabContainer looks like in FF at 1.5, and what it looked like in the previous versions in all browsers. (IE, Chrome, Safari)
At 1.5, this is what it looks like in IE9
I can't figure out where these arrow buttons are coming from. The styling and markup hasn't changed, I've just swapped out the dojo libraries.
Here is the code:
<asp:Repeater ID="TabRepeater" runat="Server">
<HeaderTemplate>
<div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
<div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
</HeaderTemplate>
<ItemTemplate>
<div dojoType="dijit.layout.ContentPane" style="display:none; height:300px" title="<%#Eval("Name")%>">
<!-- Content -->
</div>
</ItemTemplate>
<FooterTemplate>
</div> <!-- End Tab Container -->
</div> <!-- End Border Container -->
</FooterTemplate>
</asp:Repeater>
It's pretty basic, I've defined the sizes for the containers. I'm not sure why these scroll buttons won't go away. I'm not sure if this is a problem with my code or with the TabContainer since their documentation site doesn't even work in IE9
FF:
IE9:
Any idea what's wrong?
Dojo 1.5 is not officially compatible with IE9. Compatibility has been officially partially supported since dojo 1.6.x and is supposed to be fully compatible with dojo 1.7.x
Also, I do not know much about asp, but this does not look like a good practice
<HeaderTemplate>
<div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
<div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
</HeaderTemplate>
to have a "tag" (except if this tag disappear and is not replaced by any html) enclosing unclosed divs...
I had the same issue using dojo 1.10.4. I was not using asp.net.
I solved this by setting the properties useMenu and useSlider of the TabContainer class:
var container = new TabContainer(
{
style: 'height: 100%; width: 100%;',
useMenu: false,
useSlider: false
}, domConstruct.create('div'))
Thanks to David Walsh.
i got stuck in an issue i.e. i wrote following css for showing page breaks in my html but i am facing the problem that it works fine in the Internet explorer but not working in firefox and chrome below is the inline css i applied
<br style="page-break-after: always;">
below is my HTML code
<asp:Panel ID="pnlHide" runat="server" Visible="false">
<br style="page-break-after: always;">
</asp:Panel>
nb:above line is in asp:panel control of asp.net which renders as DIV in html
any suggestions to change the css are welcome. I will wonder if anybody could plz help me.
If you have any floats, remove them from the css while printing, floats may be the issue and page-break may not be the issue at all.
I have been laying out a GUI uing ASP.NET and find I am confused by the rendering of the <asp:TextBox /> control. It seems as though some default margin is added to the left and right of the <input> control that is rendered by the ASP.NET TextBox. Below is an example of my code. The resultant <input> element does not align flush to the container <div>, even thought the text element above it ("Some Text") is aligned flush.
<div style="float:left;">
<b>Some Text</b>
<asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;" />
</div>
Quite by accident I found that if I first added a <p /> element as the first element in the <div> that the <input> element would align flush. Here is an example ...
<div style="float:left;">
<p />
<b>Some Text</b>
<asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;" />
</div>
Does anyone know why this is? Why does the <input> element not align flush to the <div>, yet when adding a <p /> do the <div> it does?
UPDATE - I found the issue was Internet Explorer compatibility mode. It was enabled and therefore not following the CSS rules. After disabling compatibility mode the textbox lined up properly. Thanks for all the answers. They were ALL great and helped me track down the problem. +1 to all. I answered the post so as to make it easier for future readers to find the answer.
I don't know what asp does with this and your p element is invalid in html as you have it. Remove that.
You probably need to set your padding or margin to zero on the input element.
Are you using a doctype?
I don't see any problem when I test your example, the TextBox is flush to the edge of the div at the top, right and bottom (with Some Text on the bottom left).
There must be other CSS affecting your layout.
I'd suggest using Firebug, IE's F12 developer tools or Chrome's Ctrl-Shift-J developer tools (dependent on your browser) to have a look at the HTML that's created. That should give you the answers you need.
I believe this is because <p> is a block element. You can do what you are wanting to do by adding a div around your inner content (nesting a div inside your existing div)
<div style="float:left;">
<div>
<b>Some Text</b>
<asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;" />
</div>
</div>
check if you have correct doctype on top of your page
use vertical-align style in the text container div: <span style="vertical-align:middle; font-weight:bold;">Some Text</span>
.
<div style="float:left;">
<span style="vertical-align:middle; font-weight:bold;">Some Text</span>
<asp:TextBox ID="txtTextBox" runat="server" TextMode="MultiLine" Style="width:300px;height:300px;" />
</div>
I discovered what the issue was. I was using Internet Explorer v8 with compatibility mode enabled. I am not sure why it was enabled but as soon as I disabled compatability mode the textbox aligned just as it should.