How to create twitter style nice button ?


Hi

Here is handy online tool available for creating nice twitter style button.

http://charliepark.org/bootstrap_buttons/

Here no need to our own css, this tool will create css for us and we can use in our web project.

How to remove blue border from Image hyperlink ?


Hi

So many time, we will get scenario to remove blue border from Image hyperlink. Then we can remove like this using CSS

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
<style type="text/css">
.Removeunderline
{
   border-style:none;
}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<a href="Default5.aspx">
 <asp:Image ID="Image1" Height="50px" Width="150px" ImageUrl="~/eHelpine.jpg" CssClass="Removeunderline"  runat="server" /> </a>

</asp:Content>

How to create effect on Textbox using CSS ?


CssEffect

Hi

We can add very nice effect on asp.net Textbox using this CSS like this


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
    text {
    border: 1px solid #666;
    border-radius: 5px;
    padding: 3px;
}

.text:focus {
    border: 1px solid #07c;
    box-shadow: 0 0 5px #07c;
    outline: none;
}
    
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        UserName : <asp:TextBox ID="TextBox1" CssClass="text" runat="server"></asp:TextBox>
        <br /> <br /> 
        Password&nbsp; : <asp:TextBox ID="TextBox2" CssClass="text" runat="server"></asp:TextBox>
        <br />
        
    </div>
    </form>
</body>
</html>

How to design master page with proper CSS ?


masterpage
Hi

I have seen so many person used to design the master page in asp.net without writting CSS just like drag, drop and so many hardcoded alignment with in that master page. But it is not a good practice ane even though html page will look so dirty.

For design any master, you can write proper external css class which will be applicable in all the page like this

Step1: Write this in external CSS file

html
{
font-family:Tahoma;
font-size:14px;
font-style:normal;
background-color:Silver;
}
.Content
{
margin:auto;
width:700px;
background-color:white;
border:Solid 1px black;
}

Note: here whatever css you will write in html portion that will be applicable to all the pages where you will call css file reference.

Step 2: drag and drop the css reference in master header portion
Step3 : Call the CSS class in master in like

<form id=”form1″ runat=”server”>
<div class=”Content”>
<div>This is the header part</div>
<asp:Button ID=”btnClick” runat=”server” Text=”Click Here”
onclick=”btnClick_Click” />
<asp:ContentPlaceHolder id=”ContentPlaceHolder1″ runat=”server”>

</asp:ContentPlaceHolder>
<div>This is the footer part</div>
</div>
</form>

Good CSS URL for Asp.net Project


Hi

Here is some nice css url, from where you can take the css code and use it in your project

10 CSS example

Some useful CSS example

25 CSS Example

31 CSS Example

Posted in CSS. 1 Comment »

How to display custom error message using CSS and validation control ?



Hi

Recently i was doing some test using CSS.Then i got very nice css, which one we can use in our real time project.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CustomCSSTest.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
.errors
{
border: solid 1px Blue;
background-color: #d0e6ff;
padding: 10px;
}

</style>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
runat="server" ErrorMessage="Enter Your Name Please!" CssClass="errors" ForeColor="Blue"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
<asp:Button ID="Button1" runat="server" Text="Button" />
</td>
<td>
</td>
</tr>
</table>
<div>

</div>
</form>
</body>
</html>

Posted in CSS. 2 Comments »

How to make cross browser compatibility of website?


Hi
Some many time, while developing web based project, It will look proper on one browser,but it doesn’t look proper on other browser. I had faced this problem so many time.

Here is some free tools which will help to check the XHTML and CSS standards.

If we don’t follow this standard then it will not look proper on all browser.

To validate HTML and XHTML
http://validator.w3.org/

To validate CSS
http://jigsaw.w3.org/css-validator/