asp.net styling

Question

Greeting, I listed two examples of using style propriety for asp.net control.

what is the difference between the to examples?

my goal is to set the style and positions of asp.net controls in my page to be stable in firefox and IE browsers.

and should set the position as absolute or elative.

I have 30 asp.net controls in my page and I'm having problems with their positions.

please advice.

Example1:

<asp:TextBox ID="txtFirstName" runat="server" 
Style="top: 198px; left: 421px; 
position: relative; height: 23px; width: 144px">
</asp:TextBox>

Example2:

    <style type="text/css">              

    .mystyle
    {
        position:relative;
        top: 836px; 
        left: 662px;
        height: -4px; 
        width: 128px;

    }
     </style>




<asp:TextBox ID="txtFirstName" runat="server" 
CssClass="mystyle">
</asp:TextBox>

Answer 1

Apart from values Example 1 is called inline style and Example 2 is called css style.

The difference between two is reusability, maintainability. You can use css style in multiple places and its easy to handle if their is any change in future.

In your case as their are 30 controls if they contain same css then make a css class and assign them. otherwise use tables or inline one.

But better is to spend some time and do it with css which would be easy to handle for maintenance and is recommended too.

Answer 2

Ok, this answer will probably not win me any points, and the CSS web design geeks will probably stalk me and throw rocks at me.......

Try using tables.

Answer 3

I personally would always go with choice 2 - separating CSS from inline styles. This will give you some advantages:

• Separation of concerns

• Your asp.net code will be less cluttered

• You can validate your CSS

Concerning how you want these displayed on your page, I would consult a designer or read up on CSS. CSS is almost an art form, and getting everything looking similar in different browsers can sometimes be challenging.

For CSS - pick a book that demonstrates designing with standards. This should help you create more maintainable and browser independent CSS code.