Results 1 to 9 of 9
  1. #1
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default I want a 2px border around each item and their description

    Hi everyone
    This is the first post that I managed to do the way I think is right. If it's not please forgive a newbie.

    I have used "column_layout_grid_v_1_3_6" and it worked great! However,
    I would like to have a 2px border around each item and their description. Where would I go to change this? I have looked in stylesheet.css and can not find anywhere that is obvious. I'm sure it's just that I don't know what I'm looking for.

    Can someone please tell me what to change, the correct syntax to do it, and what document it's in?


    I would really be grateful!

    Thanks in advance.

  2. #2
    Join Date
    Jul 2005
    Posts
    537
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Can you share a URL where you're trying to do this?

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

    Default Re: I want a 2px border around each item and their description

    Try adding a border to the productListing-data class in your stylesheet.css. Add it down at the bottom of the stylesheet if it's not there already. Something like...

    .productListing-data { border: solid 2px red; }

    should get you started. I don't have the column grid mod installed so I can't test it for you, but I see that class is used in their code.

    If that styles the whole row instead of the individual products, then use your Firebug or Developers Tools browser add-in (you have one or both of them, right?) to discover which class to add the border to.

    HTH

    Rob

  4. #4
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Thank you both for answering! You have no idea how much I appreciate it.

    the url is: http://grafix.triplemoonranch.com/hp...=index&cPath=8

    Thank you chuck for offering to take a look and check it out! Please let me know what you think.


    And yes rstevenson I do have both tools and in firebug I can see the class but could not find it when I went to the stylesheet.. and had no idea where to add code
    I am trying your suggestion right now and will let you know how it turned out.

    Thank you for responding, for a while there I thought no one would.

  5. #5
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Quote Originally Posted by rstevenson View Post
    Try adding a border to the productListing-data class in your stylesheet.css. Add it down at the bottom of the stylesheet if it's not there already. Something like...

    .productListing-data { border: solid 2px red; }

    should get you started. I don't have the column grid mod installed so I can't test it for you, but I see that class is used in their code.

    If that styles the whole row instead of the individual products, then use your Firebug or Developers Tools browser add-in (you have one or both of them, right?) to discover which class to add the border to.

    HTH

    Rob
    rstevenson thank you for your assistance you have no idea how much it means to me, I kinda thought no one was going to reply.

    yes I do have Firebug and I can see the class and it gives a pretty good idea where I would need to work...but I can not find that class in the stylesheet nor did I knonw where to add code or how to go about it (as in what syntax I would need to use)

    I am trying your code right now and will let you know how it turned out.
    Again Thank you so much.

  6. #6
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Quote Originally Posted by chuck View Post
    Can you share a URL where you're trying to do this?
    Thank you Chuck this is the url:

    http://grafix.triplemoonranch.com/hp...=index&cPath=8

    Again thank you for your help!

    Suzanne

  7. #7
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Quote Originally Posted by triplemoonranch View Post
    rstevenson thank you for your assistance you have no idea how much it means to me, I kinda thought no one was going to reply.

    yes I do have Firebug and I can see the class and it gives a pretty good idea where I would need to work...but I can not find that class in the stylesheet nor did I knonw where to add code or how to go about it (as in what syntax I would need to use)

    I am trying your code right now and will let you know how it turned out.
    Again Thank you so much.
    ok adding the code you gave me at the bottom did not create any change good or bad.

    I do have Firebug, below are 3 lines of code that show in firebug and when I mouse over them each line highlights one of my columns. these 3 lines are directly under the line
    <div id="productListing">

    which when I lay the mouse over highlights the entire product area all 3 columns at one time.

    <div class="centerBoxContentsProducts centeredContent back" style="width: 32.5%;">
    </div>

    <div class="centerBoxContentsProducts centeredContent back" style="width: 32.5%;">
    </div>

    <div class="centerBoxContentsProducts centeredContent back" style="width: 32.5%;">

    I hope this helps you help me.
    Again thanks for taking the time for the newbies who are walking through this thing almost blind.

    Suzanne

  8. #8
    Join Date
    Feb 2008
    Posts
    22
    Plugin Contributions
    0

    Default Re: I want a 2px border around each item and their description

    Quote Originally Posted by rstevenson View Post
    Try adding a border to the productListing-data class in your stylesheet.css. Add it down at the bottom of the stylesheet if it's not there already. Something like...

    .productListing-data { border: solid 2px red; }

    should get you started. I don't have the column grid mod installed so I can't test it for you, but I see that class is used in their code.

    If that styles the whole row instead of the individual products, then use your Firebug or Developers Tools browser add-in (you have one or both of them, right?) to discover which class to add the border to.

    HTH

    Rob
    Rob! I'm doing one huge happy dance!
    The code you gave me got me close enough that with the help of Firebug I came up with this line:


    .centerBoxContentsProducts { border: solid 1px #c9b495; }

    Which did the trick.... now I just have to figure out how to get a little space between the graphic and the border... I kinda have an idea about how to accomplish this but not sure it's correct.


    Thank you for your help it was just enough to get me started and still make me think for myself!

    Suzanne

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

    Default Re: I want a 2px border around each item and their description

    Hi Suzanne,

    Glad I could nudge you in the right direction.

    Just a note about that 32.5% width. Any "style= something " in the HTML code is coming from the php files. That is, it's hard-coded into the files in some way, or maybe, if you have a choice of number of columns in this mod, it's calculated and then set in the code.

    This makes it difficult to make a margin between those blocks using a declaration in your stylesheet. I see you've made a margin around the images though, so maybe a margin around the blocks isn't necessary. But if it is, I'd PM the author of the mod, or visit the mod's support thread here on the forums to see what can be done about it.

    Very nice looking site by the way.

    Rob

 

 

Similar Threads

  1. Border around product title, description, price and buy now button
    By Advisers Australia in forum Templates, Stylesheets, Page Layout
    Replies: 8
    Last Post: 19 Jan 2014, 11:29 AM
  2. v139h Want to add a border around my main page text.
    By mighty midget in forum Templates, Stylesheets, Page Layout
    Replies: 14
    Last Post: 13 Jan 2012, 07:21 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