Announcement

Collapse
No announcement yet.

Change of border colours & style

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Change of border colours & style

    I'm evaluating Norman's multi-column patch but I have a couple of questions (at least one of which, I think, will be a tall order).

    The site sells bicycles and, for younger ages, we have split between boys and girls bikes for a given age range. The way I have ordered the fragments and products is such that the boys will always be on the left and the girls on the right.

    http://www.bicyclebay.co.uk/acatalog..._Years_Up.html

    Is there any way that I can colour the border for the boys stuff in one colour and use a different colour for the girls borders?

    Secondly, I'm using CSS to define the borders but is there a simple way to round the corners? I see that Mozilla will allow -moz-...radius to be applied to a border to give different levels of rounding. But this doesn't work with IE. Or do I resort to graphics?



    And, on another note, I have boxes on either side of the main area which I am having loads of trouble from sizing correctly. They look fine in one resolution but the rounding goes to pot when I either a) change resolution or b) change font size in IE View>Text Size. Other Actinic sites I look at do not suffer these problems when I try a) and b) on them. Is this because they have specified specific font sizes rather than "xxsmall" etc.??


    Thanks

    Andy

    BTW - the site's not finished yet... don't go looking for cycles in any other category!
    Elysium:Online - Official Accredited SellerDeck Partner
    SellerDeck Design, Build, Hosting & Promotion
    Based in rural Northants

    #2
    I'm only answering the table border question. Perhaps others will look at your additional points.

    Here are 2 ways:

    1) The automatic way:

    In your Product template you have:
    Code:
      <!-- START each product lives in this table - alter below to rearrange items -->
      <table width="100%" class="tblBoysBorder">
    You can generate the <table...> line like
    Code:
    <script type="text/javascript">
    <!--
    var cls = (currentcol == 1) ? 'tblBoysBorder' : 'tblGirlsBorder';
    document.write('<table width="100%" class="' + cls + '">');
    // -->
    </script>
    <noscript><table width="100%" class="tblBoysBorder"></noscript>
    2) The CUSTOMVAR way.

    Create a Custom Property BIKECLASS
    In Design / Options / Site Defaults set it to tblBoysBorder

    Change the <table...> to

    <table width="100%" class="CUSTOMVAR:BIKECLASS">

    and on the girls products set Property BIKECLASS to tblGirlsBorder.
    You don't need to bother with the boys as the default property will be used.
    Norman - www.drillpine.biz
    Edinburgh, U K / Bitez, Turkey

    Comment


      #3
      Originally posted by Goz
      is there a simple way to round the corners?
      With the vast majority of the internet still using IE as the default browser best avoiding moz specific hacks (just as you are in using IE specific hacks).

      I posted a thread http://community.actinic.com/showthread.php?t=17852 implementing rounded corners to the smart theme which you are free to use


      Bikster
      SellerDeck Designs and Responsive Themes

      Comment


        #4
        Thanks guys...

        Norman - I've implemented the automatic way. Works perfectly. Thanks.

        Jont - I've read your post and I need to think about it (and figure out how to swap colours in Fireworks!!).

        thanks your help

        Andy
        Elysium:Online - Official Accredited SellerDeck Partner
        SellerDeck Design, Build, Hosting & Promotion
        Based in rural Northants

        Comment

        Working...
        X