Page 1 of 2 12 LastLast
Results 1 to 10 of 13
  1. #1
    Join Date
    Feb 2012
    Posts
    68
    Plugin Contributions
    0

    Default CSS #categoriesContent

    I am trying to separate categories in the left hand side box with divider lines. I added this to the bottom of my css stylesheet at:/includes/templates/classic/css/stylesheet.css.
    Code:
    #categoriesContent, .sideBoxContent {
    	 border-bottom:solid black 1px;
    	}
    I now have a line at the bottom, but not all of the way through. I want to add more categories, and it is already confusing to tell the difference between them.
    Name:  sidebar.GIF
Views: 116
Size:  8.1 KB

  2. #2
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: CSS #categoriesContent

    Posting Tips

    If you're encountering display/layout problems, post your site URL* so it can be seen in action.

    Screen shots do not help very much

    you might also want to look at Categories Dressing in the Free Mods section

  3. #3
    Join Date
    Feb 2012
    Posts
    68
    Plugin Contributions
    0

    Default Re: CSS #categoriesContent

    http://www.abcrealestateschools.com/ABCOrderForm/

    The category box on the left needs separations between categories. Is the Categories Dressing necessary? Can divider lines be created in css?
    Last edited by abcschooldr; 5 Jun 2012 at 11:44 PM.

  4. #4
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: CSS #categoriesContent

    no not necessary but gives you more control over the look

    here is the easy way - in:
    /includes/templates/YOUR_TEMPLATE/sideboxes/tpl_categories.php

    find:
    Code:
    $content .= '<br />' . "\n";
    change to:
    Code:
     $content .= '<br /><hr />' . "\n";

  5. #5
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: CSS #categoriesContent

    then in admin>configuration>layout settings

    find:
    Categories Separator between links Status

    change to: "0"

    this way you will not have double lines at end of categories if you opt to show new, specials, ect. links

  6. #6
    Join Date
    Feb 2012
    Posts
    68
    Plugin Contributions
    0

    Default Re: CSS #categoriesContent

    Wow!! It worked perfectly!

  7. #7
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: CSS #categoriesContent

    glad this worked for you :-)

  8. #8
    Join Date
    Nov 2006
    Location
    Dartmouth, NS Canada
    Posts
    2,378
    Plugin Contributions
    0

    Default Re: CSS #categoriesContent

    Quote Originally Posted by abcschooldr View Post
    Can divider lines be created in css?
    For my retail site (link in my sig below) this bit in the CSS puts in the dotted line under the category names in the left nav panel. (Click one of the categories in the top horizontal nav on the home page to see the side nav panel on all other pages.)

    Code:
    .sideBoxContent ul li {
        background: url("../images/li_underline.gif") repeat-x scroll left bottom transparent;
        padding: 2px 0 4px;
    }
    I'm not CSS savvy enough to invent that. It came with my template. I haven't tried it, but I assume that a border style could be used instead of the gif.

    Rob

  9. #9
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: CSS #categoriesContent

    The stock categories sidebox does not have the <ul><li>, but is simply inline <a> elements separated by <br /> to keep them on different lines. Very primitive, unchanged since 2003 (and probably pre-2000 in osC).

  10. #10
    Join Date
    Feb 2010
    Location
    Syracuse, NY
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: CSS #categoriesContent

    Quote Originally Posted by gjh42 View Post
    The stock categories sidebox does not have the <ul><li>, but is simply inline <a> elements separated by <br /> to keep them on different lines. Very primitive, unchanged since 2003 (and probably pre-2000 in osC).
    hence the <hr />

 

 
Page 1 of 2 12 LastLast

Similar Threads

  1. v151 How to uninstall CSS Horizontal Drop Down Menu (CSS Flyout Header 1.5)
    By cmike in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 15 Feb 2014, 07:39 AM
  2. How to edit CategoriesContent ?
    By kobra8 in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 22 Nov 2011, 10:03 AM
  3. Replies: 1
    Last Post: 21 Feb 2009, 04:20 PM
  4. want to reposition an image using css. what is css to control this?
    By what44 in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 10 Nov 2007, 05:03 AM
  5. how to insert css buttons created with CSS Tab Designer 2?
    By lankeeyankee in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 24 Mar 2007, 08:27 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR