The title says it all. I have a Style.css that apply properties to every <Table> on every page. I have 1 SiteMap page, on which i don't want to apply CSS for <table>. I tried this as a directive:
#page :not(:last) { }
It didn't work, besides i had to apply on any specif page, not the last one.
Edited
The table is auto-generating from XML file.
Edited
SiteMap.aspx
<asp:SiteMapDataSource ID="SiteMapDataSource1" Runat="server" />
<h3 id="Heading">SiteMap</h3>
<br /><br />
<asp:TreeView ID="TreeView1" Runat="Server" DataSourceID="SiteMapDataSource1" >
</asp:TreeView>
Change your CSS to exclude the generated TreeView table, e.g.
table:not(#TreeView1) { ... }
Related
I have a s:checkbox inside a html div. When the code is run, the checkbox is outside (both) the div and the divs seem to be empty and nonexistant. Why is this occuring and how can I fix it? When I place random text inside either div, the div contains it. I set the background color to red so I can detect the div.
<div id="outer">
<div id="inner">
<s:checkbox name="chBx" id"chBx" fieldValue="false" value="true" label="Check
This" />
</div>
</div>
Like described in this answer (that you should consider upvoting too), Struts2 generates (or not) a certain kind of HTML when rendering Struts Tags, basing on the Theme you have chosen.
The default one is xhtml, that will generate a lot of stuff for you. It may be handy, but also annoying, according to how you work. Personally I prefer to generate the HTML by myself, and then I use the theme that won't generate almost any HTML: the simple Theme.
Note that when working on big projects or with multiple projects with the same, particular needs, you can also write your own custom theme (for example for generating security tokens automatically).
You can use a theme globally (in struts.xml)
<constant name="struts.ui.theme" value="simple" />
or locally to a single tag / form:
<s:checkbox name="chBx" id"chBx" fieldValue="false"
theme="simple"
value="true" label="Check This" />
In this case, you may need to write the <label> object by yourself.
I am using a HTML source editor to type and add images... The code I used to edit the font works perfectly fine, and so do the images..... but once I save and view my actual page http://www.youcaring.com/tuition-fundraiser/help-shelby-with-college/219039, the font is still correct, but the images don't display, they don't use the alt either, the img codes are simply showing fully as text. I'm not sure why the images show up IN the editor, but not on the main page.
I tried adding !doctype html and different ones for xhtml.. with the appropriate html, head, title, body tags and endings... but every time I save and view the page, the images are still only posted as text, and when I go to re-edit the code, the !doctype stuff I added as been automatically deleted.
I also tried changing any " < and > to " < and > but still no luck.
I have the proper end tags on my img codes as well />
All the images are proper http links and they are all working. I don't know what to try next!
Like mentioned earlier, the code works perfectly when it is in the text editor... and also when plugged into w3schools.com's tryit editor... but it doesn't work on the actual page I'm trying to put it on. Here is the img code:
<div style="text-align: center;">
<img src="http://www.icandog.org/files/image/bristol-thank-you.jpg" alt="Thank You" width="500" /><br /><br />
<img src="http://25.media.tumblr.com/tumblr_m6rmkgje1w1ry7wi4o1_500.gif" alt="Thank You" width="500" /><br />
</div>
Here is what the img codes are showing up as: http://static.tumblr.com/rvqsweo/DrFnac1we/example.jpg
In your source code I found something like the following:
<img src="http://www.icandog.org/files/image/bristol-thank-you.jpg" alt="Thank You" width="500">
Instead of the diamond operator you used the entity reference of < and > in all the img elements. Change
> and <
To
> and < respectively and it will solve the issue
I can apply a CSS style to an html link using
<link href="css/style.css" rel="stylesheet" type="text/css" />
Login
Is it possible to apply the same CSS style id loginCSS to the following control?
<div class="buttonCSS">
<asp:HyperLink ID="HyperLink1" runat="server"
NavigateUrl="~/Admin/Default.aspx" >Login as Admin</asp:HyperLink>
</div>
I've tried the following
<asp:HyperLink ID="loginCss" runat="server"
NavigateUrl="~/Members/Default.aspx" >Login as Member</asp:HyperLink>
which gives error 'loginCSS' is not a valid identifier.
In your css, I'm guessing you have a style based on control names:
#loginCss{
//Your styles here
}
If you change it to be based on class name:
.NewLoginCss{
//Your styles here
}
You can reference it in multiple places using the .NET CssClass and HTML class attributes:
Login
<asp:HyperLink ID="loginCss" runat="server"
NavigateUrl="~/Members/Default.aspx"
CssClass="NewLoginCss">Login as Member</asp:HyperLink>
You probably want to avoid using IDs when dealing with .NET web controls as the IDs end up looking something like: ct100_blahblah_controlName_blahblah
So just use the CssClass attribute in the Hyperlink Control:
<asp:Hyperlink ID="hyp1" CssClass="className" />
And your CSS would be:
.className { color: FFF; }
I believe ID's are pretty reserved in the older versions of .NET which is why many backend devs prefer their front-end buddies to use css classes instead.
You can look up how to apply those on your elements, but I believe its CssClass="classname"
<asp:HyperLink ID="" CssClass="loginCss" runat="server"
NavigateUrl="~/Members/Default.aspx" >Login as Member</asp:HyperLink>
when you add "runat='server'"
all ids will be prepended with ContentPlaceHolder_
so if ur id before server side was "bla"
it will be "ContentPlaceHolder_bla"
and thats the name u should use for selectors on client side.
from server side the elements will still be available by old name.
You cannot have same ID of two ASP.Net controls. There are other ways to achieve your goal. A better approach is to use CssClass attribute.
Trying to set a page break in the page I'm working on but in the print preview I'm still seeing things on the page that aren't supposed to be there. Can't figure out why this isn't working.
In my css style:
.applicant-break hr {page-break-after:always;}
In my ASP.NET code...partial view of code the start tags are there:
<b>Resume</b>
<br />
<asp:Literal runat="server" ID="litResume"></asp:Literal>
<br />
<br />
<hr class="applicant-break" />
</ItemTemplate>
</asp:Repeater>
</asp:Panel>
Any help would be appreciated.
Your css needs to be
hr.applicant-break {page-break-after:always;}
EDIT:
Doing some reading on the W3Schools website, it seems this css property is meant for table elements
"Set the page-breaking behavior to always break after a table element"
EDIT:
Doing some more reading, it seems browsers do support more than the table element, however some browsers have trouble with it on HR and BR tags (Reading here)
try putting a div after the hr like so
<hr />
<div class="applicant-break"></div>
and changing your CSS to
div.applicant-break {page-break-after:always;}
So apparently I'm silly, I was trying to trust the print preview of Chrome instead of just actually printing it myself, upon printing it I see that the page break does in fact work, thanks for your assistance m.t! :)
So fair warning to anyone else reading this, while it is useful it doesn't always give you an accurate look at your print job all the time.
I have an issue where Internet Explorer is generating an additional br element that is not in my source. The additional br effects the page's layout and is visible when using the developer tool. I've tried removing all hard returns between the surrounding elements but the additional br persists. Firefox and Chrome do not have this issue. Ideas on what I can do to fix the issue?
Instead of
First line.
Second line.
I get
First line
Second line.
Code Example
<asp:ImageButton ID="RemoveItem" AlternateText="Remove Item"
ImageUrl="~/img/buttons/remove.png" runat="server" CssClass="remove"
CommandName="Remove" OnCommand="RemoveCartItem_Command" />
<br runat="server" id="TotalBreak" />
<span class="fieldlabel">Total</span>
And what I end up with (... used to show I've shortened rendered ids)
<input id="...RemoveItem" class="remove" alt="Remove Item"
src="img/buttons/remove.png" type=image name="...RemoveItem" />
<br id="...TotalBreak"/>
<br/>
<span class="fieldlabel">Total</span>
It's probably due to line-height or another default in the browser's default style sheet. Like buyckbova said, you should use a CSS reset. Try Eric Meyer's, it's thorough: http://meyerweb.com/eric/tools/css/reset/
Try a CSS reset to remove browser defaults.