i am trying to make the control not visable through the css but still the control is been shown.
i tried doing like this
html1.Visible = false;
but this creates an gap in the menu where is been used
HtmlAnchor html1 = (HtmlAnchor)holder.FindControl("lblA1");
html1.Attributes.Add("class", "display:none");
i want to hide the control and do not want to display the gap there
how can we achive this.
any help on this would be great
You just need to use style instead of class:
html1.Attributes.Add("style", "display:none");
You may also consider the option of making a CSS style like:
.hidden
{
display:none;
}
And then apply it via 'class':
html1.Attributes.Add("class", "hidden");
If you want to add more than one property in style element in that case use Style property instead of Attributes property like this example....
HtmlAnchor html1 = (HtmlAnchor)Page.FindControl("lblA1");
html1.Style.Add("display", "none");
You can attach this class to button using above methods
Very helpful when the button is taking the space , which it shouldn't be
<style>
.hideAspButton
{
position: absolute;
visibility: hidden;
}
</style>
Related
I have an asp.net gridview and have just added sorting to the columns. This has now obviously changed the column headers to links and they have changed to a blue colour but for some reason my modifications to change the colour of the links isn't working and they just wont pick-up the correct style.
Here is some CSS that I tried, I have tried it a few other ways too but wanted to test it using the most basic setup:
a:link {
color:white;
}
a:visited {
color:white;
}
use !important with Sachin's answer
a{
color:white !important;
}
Try this
div #something .gridview td a{
Color: red! important;
}
Try to set style more specific to your anchor tag.
I want to add a form-feed to my panel after each Item that I print so that I can have each Item print on its own page.
Is that even possible to do?
For example I can add a line-break to my panel but not sure how to add a form-feed.
Example:
Panel1.Controls.Add(new LiteralControl("<br />"));
Any help would be appreciated.
Thank you
Use the page-break-after css style:
Panel1.Controls.Add(new LiteralControl("<br style='page-break-after:always;' />"));
And watch for the newer break-after css style to replace it (not well supported yet):
Panel1.Controls.Add(new LiteralControl("<br style='break-after:page;' />"));
Note that these apply to a box, so using a <br/> may not be the best choice. An <hr/> might work better.
You can use css to get the desired behaviour.
There are page-break css attributes that instruct the browser to insert page breaks before or after an html element.
Ideally, they should not impact the look of the page when displayed in a browser, so you should use media queries, something like:
#media all {
.page-break { display: none; }
}
#media print {
.page-break { display: block; page-break-before: always; }
}
The form feed character is "\f".
Note that HTML is whitespace agnostic, so browsers will render this as just a normal space character. But if you really need a form feed, that's how to do it.
Maybe there is a CSS style for this, but, I want my TextBox to look like a label. When it is focused, I want it to look like whatever CSS style is applied. I am using bootstrap so that would be the style.
Is there some way to do this?
I have a grid view that I want to allow the user to rename without using the Edit Mode.
Thanks
(EDIT)
I mean an editable label:
see http://dotnetspeaks.net/post/exm/EditableLabel.aspx
Here's a wild guess (since the question itself is a bit vague):
input {
border: none;
padding: 2px;
}
input:focus {
border: 1px solid black;
}
And, voila! (and a version that more traditional)
You can use textbox by making it appear label and making it textbox on click or on focus. (just an approach, question is bit confusing.)
<script type="text/javascript">
function TextBox2Label()
{
var control=document.getElementById("<%=TextBox1.ClientID %>");
control.style.borderStyle="none";
control.style.backgroundColor="Transparent";
control.style.fontStyle.fontColor="Black";
control.readOnly=true;
}
</script>
I'm in dire need of assistance.
I need to add a custom button to an HtmlEditorExtender control, but I'm lacking the know-how to actually do that.
I've searched throughout this forum but no information was relevant or whatsoever.
Should someone be so kind to help, I need an example to help me sort this issue out.
Thanks in advance.
One possibility is to add it to the DIV containing the buttons using javascript. I do it using jQuery.
If you inspect the DIV in Firefox, you'll notice that it has a class named 'ajax__html_editor_extender_buttoncontainer'. Knowing this class allows you to select the container and add your own custom button to it.
To do so, add the following jQuery script in the HTML below your HtmlEditorExtender:
<script language="javascript" type="text/javascript">
// retrieve button container div using its class
$btnContainer = $(".ajax__html_editor_extender_buttoncontainer");
if ($btnContainer.length == 1) {
// append your custom button to the collection of elements within the button container div
$btnContainer.append("<input id=\"HtmlEditorExtender_YourButtonName\" class=\"ajax__html_editor_extender_YourButtonName\" type=\"button\" name=\"YourButtonName\" title=\"YourButtonName\" style=\"width: 101px; height: 21px;\" unselectable=\"on\"></input>");
}
</script>
To style the button, create images for it and add the following to your style sheet:
/* custom button */
.ajax__html_editor_extender_YourButtonName {
background: url('/images/YourButtonName_off.png') no-repeat scroll;
cursor: pointer;
display: block;
float: right; /* default is left */
border: medium none;
}
.ajax__html_editor_extender_YourButtonName:hover {
background: url('/images/YourButtonName_on.png') no-repeat scroll;
}
The appearance of your button is of course up to you, but the result may look something like this:
Finally, to add functionality, add a click event to elements that have the class you specified. You can do this in your external .js file.
If you want to access the html of the textbox, inside that click you will want to retrieve the html of the first of two divs that have the attribute contenteditable='true'. This is the design view of the HtmlEditorExtender.
Add the following to your .js file:
// click event for the custom button
$("body").on("click", ".ajax__html_editor_extender_YourButtonName", function (e) {
var $editorDiv = $("div[contenteditable='true']").first();
alert($editorDiv.html());
})
There's probably a more efficient way to get the design view but it'll work.
Can someone tell me how to set a:visited and a:hover programmatically? I am dynamically building up some hyperlinks server-side and want to know how to specify unique css behaviour for each link. Otherwise I would set them all in a stylesheet.
If you want to set the style for a single item, you can use the CssClass attribute, then set up the classes in your css.
.linkA:visited {
color: red;
}
.linkB:visited {
color: blue;
}
In your codebehind:
LinkOne.CssClass = "linkA";
LinkTwo.CssClass = "linkB";
not sure I understand - wouldnt this work?
Hyperlink1.CssClass = MyAnchorClass;
Unless things have changed, you can't specify the a:visited and a:hover within an HTML anchor (a) tag, so in the end you will need CSS somewhere (on the page, in a file) and assign the class to each anchor tag, like what willoller said.
Here's how you do it inside code:
imageButton.Attributes.Add("onmouseout",
"this.src='../../../App_Themes/White/Images/default.png';");
imageButton.Attributes.Add("onmouseover",
"this.src='../../../App_Themes/White/Images/default.hover.png';");
imageButton.ImageUrl = "~/App_Themes/White/Images/default.png";