Results 1 to 6 of 6
  1. #1
    Join Date
    Sep 2004
    Location
    Indiana
    Posts
    105
    Plugin Contributions
    0

    help question Remove border around sidebox headers only

    I'm trying to change the borders around my sideboxes so they look like they are hanging from the custom headers like here....

    http://www.flickr.com/photos/simply_...ons/294572513/

    I've been able to totally remove them, change their color, but I can't seem to figure out how to only remove the part that surrounds the header graphic.

    Does anyone know how to accomplish this?

    Any help would be greatly appreciated!

    ~Blessings~
    Christy

  2. #2
    Join Date
    Aug 2006
    Location
    Canada
    Posts
    1,029
    Plugin Contributions
    5

    Default Re: Remove border around sidebox headers only

    Hmmm... I think I know what you want.

    In your current template stylesheet.css, you will find the sidebox borders;
    Code:
    .leftBoxContainer, .rightBoxContainer {
    	margin: 0em;
    	border: 1px solid #9a9a9a;
    	border-bottom: 5px solid #336633;
    	margin-top: 1.5em;
    	}
    You don't require them there, you would want the borders around the sidebox content only. Omit the lines in red from the above code. You will have nekkid sideboxes now.

    In your current stylesheet, find right below the above code;
    Code:
    .sideBoxContent {
    	background-color: #ffffff;
    	padding: 0.4em;
    	}
    Replace above with;
    Code:
    .sideBoxContent {
    	background-color: #ffffff;
            border: 1px solid #000000;
    	padding: 0.4em;
    	}
    Adjust the added border declaration to your liking, to match with the image.

    This will give you a pathway to your desired design, methinks.

  3. #3
    Join Date
    Sep 2004
    Location
    Indiana
    Posts
    105
    Plugin Contributions
    0

    Default Re: Remove border around sidebox headers only

    Sketchy,

    Thank you very much. This worked. I tried part of that, but not all..... should have played around more before I gave up!

    Christy

  4. #4
    Join Date
    Aug 2006
    Location
    Canada
    Posts
    1,029
    Plugin Contributions
    5

    Default Re: Remove border around sidebox headers only

    Hi Christy. I'm glad that was what you needed. See, you were close... so, never give up.

  5. #5
    Join Date
    Nov 2006
    Posts
    3
    Plugin Contributions
    0

    Default Re: Remove border around sidebox headers only

    Hi, i need help on this also.

    My CSS is different from the post i found here, guess is of older version. I've able to remove the borders, but not able to remove the extra bottom image (www.leshoppesg.com). for my new site, i was able to remove without problem.

    Someone please help..

    == New Site CSS ==
    .leftBoxContainer, .rightBoxContainer {
    margin: 0em;
    /* border: 1px solid #9a9a9a; default */
    border: 1px solid #ffffff;
    /* border-bottom: 5px solid #336633; default */
    /* border-bottom: 5px solid #9a9a9a; Gray */
    border-bottom: 1px solid #ffffff; /* White */
    margin-top: 1.5em;
    }
    ==============

    == Old Site CSS ==
    /*SIDEBOX CSS*/
    .column_left, .column_right, .column_single {
    background: #ffffff;
    padding: 0px; /* Spacing between top & left of menu */
    }
    .boxText {
    font-size: 11px;
    line-height: 125%;
    }

    .leftbox, .rightbox, .centerbox, .singlebox {
    font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    background: #ffffff;
    border: 0px solid #9a9a9a; /* Sidebox borders */
    margin-bottom: 15px; /* Space between boxes */
    }

    .leftboxheading, .rightboxheading, .centerboxheading, .singleboxheading {
    /*background-color: #abbbd3;*/
    font-size: 10px;
    font-weight: bold;
    color: #ffffff;
    padding: 0px; /* default = 3 */
    height: 20px;
    padding-left: 5px; /* Sidebox Header Text Spacing */
    }

    td.leftboxheading a, td.rightboxheading a, td.centerboxheading a, td.singleboxheading a {
    color: #ffffff;
    }

    TR.leftboxheading, TR.rightboxheading, TR.centerboxheading, TR.singleboxheading {
    background: #abbbd3;
    background-image: url(../images/tile_back.jpg);
    }

    .leftboxcontent, .rightboxcontent, .centerboxcontent, .singleboxcontent {
    line-height: 125%;
    padding: 4px;
    border-top: 0px solid #9a9a9a; /* Side box border */
    border-bottom: 0px solid #9a9a9a;
    }

    .leftboxfooter, .rightboxfooter, .centerboxfooter, .singleboxfooter {
    background-color: #abbbd3;
    background-image: url(../images/tile_back.jpg);
    margin-bottom: 15px;
    }
    ==============

  6. #6
    Join Date
    Sep 2006
    Location
    West of Ireland
    Posts
    174
    Plugin Contributions
    0

    Default Re: Remove border around sidebox headers only

    Hi
    I need to do this hanging effect also, but only for the centre boxes, which seem to have their CSS arranged differently.
    What should I do to make this work?
    (sorry not very good with CSS yet)

    Ta

 

 

Similar Threads

  1. Remove border around product image
    By metaus in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 29 Jul 2012, 12:57 PM
  2. remove border around around images (not image border)
    By Otha in forum Templates, Stylesheets, Page Layout
    Replies: 5
    Last Post: 23 Aug 2010, 06:03 AM
  3. Remove border on *just* sidebox *headers*??
    By B0ssm4nJones in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 9 Aug 2010, 02:46 AM
  4. Trying to remove border around header
    By debtag in forum Templates, Stylesheets, Page Layout
    Replies: 6
    Last Post: 27 Feb 2008, 07:29 PM
  5. Remove border around category box
    By dealbyethan.com in forum Templates, Stylesheets, Page Layout
    Replies: 17
    Last Post: 15 Apr 2007, 12:05 AM

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