CSS UI Design/Am I in the right place?

Last post 04-20-2007 5:28 PM by mtmorgan. 9 replies.

Sort Posts:

  • CSS UI Design/Am I in the right place?

    03-23-2007, 2:38 PM
    • Contributor
      2,035 point Contributor
    • drdexter33
    • Member since 06-18-2003, 9:05 AM
    • Wilmington, North Carolina
    • Posts 595

    Hey there...

    I've decided to try my hand at using absolute positioning CSS to jazz up our UI for our latest project.

     

    Getting it to work on the other hand is making me nuts...

     is this the right place to ask for examples?

    thanks.

     

    doug


  • Re: CSS UI Design/Am I in the right place?

    03-24-2007, 4:23 PM
    Maybe you could be a bit more specific?
    Regards Mike
    [MVP - ASP/ASP.NET]
    My site    Please help - URGENT!!!    What ASP.NET can and can't do
  • Re: CSS UI Design/Am I in the right place?

    03-26-2007, 9:19 AM
    • Contributor
      2,035 point Contributor
    • drdexter33
    • Member since 06-18-2003, 9:05 AM
    • Wilmington, North Carolina
    • Posts 595

    sorry for being so vague...

     i was just trying to find examples of CSS in the context of ASP.Net...

     

    I think I've worked it out.

     

    Thanks.

    doug

     


  • Re: CSS UI Design/Am I in the right place?

    03-26-2007, 1:51 PM
    So you've discovered the CssClass property of server controls, then?
    Regards Mike
    [MVP - ASP/ASP.NET]
    My site    Please help - URGENT!!!    What ASP.NET can and can't do
  • Re: CSS UI Design/Am I in the right place?

    03-26-2007, 3:51 PM
    • Contributor
      2,035 point Contributor
    • drdexter33
    • Member since 06-18-2003, 9:05 AM
    • Wilmington, North Carolina
    • Posts 595

    well actually, I've been aware of that property and using it pretty superficially, however my in-depth knowledge of CSS for layout has been lacking...

    I've been dependent on tables for that since I started developing web pages back in '96....

     someone turned me on to cssZenGarden and what is  possible using CSS for content, and wondered who's been doing that kind of stuff in the ASP.Net world..

     thanks

    doug


  • Re: CSS UI Design/Am I in the right place?

    03-26-2007, 4:40 PM

    I don't believe css positioning v tables for page layout is an ASP.NET thing.  There are those who prefer to follow the W3C recommendations and use CSS and those that don't.  Equally, there are those who can work with CSS and those that haven't got to grips with that particular speciality yet.  ASP.NET makes it more difficult to have a pure css layout, because the default rendering of most of the databound controls, and other server controls is in tables.

    I use divs and css for layout because I find I get significantly lighter pages, and I don't have to fight my way through a russian doll of nested tables.  I steer clear of any solution that requires cross-browser "hacks", and all my sites use a fixed width #wrapper div.


    Regards Mike
    [MVP - ASP/ASP.NET]
    My site    Please help - URGENT!!!    What ASP.NET can and can't do
  • Re: CSS UI Design/Am I in the right place?

    03-26-2007, 5:40 PM
    • Contributor
      2,035 point Contributor
    • drdexter33
    • Member since 06-18-2003, 9:05 AM
    • Wilmington, North Carolina
    • Posts 595

    Great tips...thanks..

     

    one more question:Say you need to create an ascx control that looks like this:

     

    And all of the stuff needs to retain it's position when it's placed in the master page.

    Currently I've got everything in a Panel control.

    Would it be better to place it in  a wrapper?

    I decided to put it in CSS because there's some overlapping design element layers (text, photo of woman, not to mention the DataList control) 

    thanks again for your help..

     

    doug

     


  • Re: CSS UI Design/Am I in the right place?

    03-27-2007, 3:08 AM

    See, now this is where people seem to suffer the greatest confusion, in my opinion.  They look at the Tools panel in VS/VWD and see all these marvellous Panel Controls/DropDownLists/ListBoxes/GridViews etc and completely forget, or are oblivious to the fact that every single one of them renders as html. 

    A fundamental understanding of how these things render is crucial, as is an understanding of the CSS box model, and how to apply it to block level html elements.  A "panel control" is just a straightforward div.  What I termed earlier as a #wrapper is a div with a width set to whatever I want to constrain the page content.  If you style the resulting div rendered by your panel control with a width attribute, you have effectively used a wrapper.  You can do this from a style sheet or using inline styles.  I prefer a style sheet for cleaner separation of presentation and content.

    Basically what I'm suggesting is instead of looking at your page as a collection of panel conrols, datalists, imagebuttons etc, you should think of the html that needs to be used to render your page in the way you want it.  Then you can best decide which artifacts in the Toolbox will result in what you want.  The only real difference between the ones that appear under General, and the ones that appear under HTML is that the former automatically acquire a unige ID name and runat="server", so they can be manipulated in your server-side code.  Once they appear in a browser, they are identical to eachother.

    Does that help focus things for you? 

    Regards Mike
    [MVP - ASP/ASP.NET]
    My site    Please help - URGENT!!!    What ASP.NET can and can't do
  • Re: CSS UI Design/Am I in the right place?

    03-27-2007, 8:56 AM
    • Contributor
      2,035 point Contributor
    • drdexter33
    • Member since 06-18-2003, 9:05 AM
    • Wilmington, North Carolina
    • Posts 595

    So I'm guessing that I should probably use html or css tags for content and server controls (gridviews, repeaters) for data presentation?

    Or is that too dogmatic and not flexible enough?

    It would kind of make sense in that if I don't need a server control and all of the overhead associated with it, why use it for simply jazzing up the page?

    thanks again...

     doug

     


  • Re: CSS UI Design/Am I in the right place?

    04-20-2007, 5:28 PM
    • Member
      14 point Member
    • mtmorgan
    • Member since 02-01-2007, 1:19 PM
    • Posts 5

    Some good resources to get you started down the CSS pathway:

     website:

    • http://www.456bereastreet.com
    • http://www.cssplay.co.uk/index.html
    • http://blog.html.it/layoutgala
    • http://www.oswd.org
    • http://www.csselite.com

    books:

    • CSS: The Definitive Guide, 3rd Edition
    • CSS Mastery: Advanced Web Standards Solutions
    • Eric Meyer on CSS: Mastering the Language of Web Design
    • More Eric Meyer on CSS
    • Designing with Web Standards, 2nd Edition
    • Web Standards Solutions: The Markup and Style Handbook
    http://www.nerdbooks.com has all of the books

     

Page 1 of 1 (10 items)