in

dashCommerce

An ASP.NET Open Source e-Commerce Application

CSS Changes to correct Content Management

Last post 08-16-2008 1:03 PM by sun21170. 4 replies.
Page 1 of 1 (5 items)
Sort Posts: Previous Next
  • 08-16-2008 12:35 AM

    CSS Changes to correct Content Management

     I tried to do content management, and noticed that the 'main content' takes a portion of width while left content takes the full width,when I select a 2 -column Main Right template.

    When I select a 3 column template, then the page appears wider with  horizontal scrollbar even though there is nothing to the right of the page.

    Is there any help on this?

     

  • 08-16-2008 8:26 AM In reply to

    Re: Content Management is bad

    This is fixed up in the repository. It was a misordering of the content regions for a specific template.

    --
    Support dashCommerce - Buy Our Stuff!!


    Find a bug? Create a Work Item for a fast response.. Want to help? Create a patch for us! Documentation? Help us write some!
  • 08-16-2008 10:03 AM In reply to

    Re: Content Management is bad

     Could you please tell me how I can access the repository?

  • 08-16-2008 10:19 AM In reply to

    Re: Content Management is bad

    You can use TortoiseSVN or some other Subversion client to grab the code. Check out the FAQ.

    --
    Support dashCommerce - Buy Our Stuff!!


    Find a bug? Create a Work Item for a fast response.. Want to help? Create a patch for us! Documentation? Help us write some!
  • 08-16-2008 1:03 PM In reply to

    Re: Content Management is bad

    Answer

    I was able to solve the 'display' problem. I changed the stylesheets for the layouts and everything works as expected. The display was perfect in IE 7 and FireFox 3.0.1. This should fix a lot, if not all, display problems. No database changes are needed for this this to happen.

    These style files are under the folder '~\controls\content\styles' of the web version I downloaded a couple of days of back.

    You should overwrite the following style sheets with the styles I have mentioned below ( make sure you 'completely' overwrite the original styles, otherwise you will have problems in display). There are subtle changes in these styles, which you can see on closer inspection.

    Also, what I found important here is that the layouts being used are 'fixed layouts' where the total width including right/left margins should be 770 px. This means that you can adjust the right, left and main columns to any convenient widths proivided the above rule is followed.

    Also, when the layout says 'Main Right' it means there is a right column and a main column, so that the main column is leftmost column. When layout is 'Main Left' it means that there is a left column and a main column, so that the main column is rightmost column. These layouts apply to the area that is to the right of 'Category Navigation Bar' on left and below the 'Main Menu'. I hope I could paste the images of the resulting layouts, but I could not find a way to do this on this forum.

    If you enable the border CSS, that are commented in styles below, then that works also according to the tests I did

    The sorting of regions within a page happens for each column. For example, left column regions will be sorted  so that a lowest sort order value  region will be the topmost region in left column and highest sort order value will be the bottom most region of left column.

     

    3col.css

    #LeftContent {
      margin:0px;
      width: 230px;
      float: left;
      padding-top: 10px;
      text-align:center;
    }

    #MainContent{
      margin-left: 235px;
      margin-right: 165px;
      padding-top: 10px;
      width: 375px; /*550px;*/
    }

    #RightContent {
      margin-right:0px;
      width: 160px;
      float: right;
      padding-top: 10px;
      text-align:center;
    }

    2ColMainLeft.css

    #MainContent {
      float: right;
      width: 610px;
      /*border: 1px solid red;*/
    }

    #LeftContent {
      margin:0;
      text-align: center;
      width: 160px;
      float: left;
      /*border: 1px solid green;*/
    }

     

    2ColMainRight.css

    #MainContent {
      margin: 0;
      float: left;
      width: 610px;
      /*border: 1px solid red;*/
    }

    #RightContent {
      text-align: center;
      width: 160px;
      float: right;
      /*border: 1px solid green;*/
    }

     

Page 1 of 1 (5 items)