Announcement

Collapse
No announcement yet.

Logical Line breaks & CSS

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

    Logical Line breaks & CSS

    Hi,

    I'm looking to programatically insert a line break after 2 products have been displayed. Reason for this is to have 2 products displayed side by side. I've achieved this in pure CSS however if too much text is entered in the product description it breaks the flow.

    Question is, is there any way to count 2 products then insert a clearboth div for example. This can easily be achieved in ASP/PHP/CFM, however I am unsure as to how actinic loops through each product to display the output HTML.

    I'm looking for something like

    <%For i = 0 to ubound(arrayData(2,0))%>
    Product info goes here
    <%if i mod 2 = 0 then%>
    <div class="clearboth">&nbsp</div>
    <%end if%>
    <%next%>

    Is this possible in Actinic????

    Thanks

    Andy

    #2
    Hi,

    If you want to put your products into columns then this kb article should help you.
    ********************
    Tracey
    SellerDeck

    Comment


      #3
      I have a solution to this that does not require using different templates for top/middle/bottom products.

      E-Mail me off the list from user profile.
      Owner of a broken heart

      Comment


        #4
        Thanks for your input folks. Although I wouldn't touch javascript with a barge poll, especially for something like this.

        I have found a solution in pure css.

        Comment


          #5
          Hi Andy,

          I have found a solution in pure css.
          This is probably way beyond me as I've only just started learning css, but can you tell us how you did it?

          Many thanks,

          Myles Sinclair
          www.magicalwonders.com

          Comment


            #6
            Myles,

            You'll need to get rid of all table code within the template you are using for products. Once you've deleted the table code wrap the contents in <div> tags and specify in the CSS settings these should float left. You'll have to specify a width, or at least a min-width and a height for the containing <div> in CSS for this to work correctly.

            I'll post the URL of the site I am working on once it goes live. It will be easier to study a working example.

            In the mean time have a look at http://www.bluerobot.com/ or http://www.alistapart.com/topics/css/ for inspiration.

            Hope this helps

            Andy

            Comment


              #7
              Hi Andy,

              Thanks for the links, which I've bookmarked. I look forward to seeing the site when it's launched.

              As I suspected, it's a bit above my head at the moment. I'm only just starting to look at css, but it's interesting stuff!

              Thanks for the info.

              Myles
              www.magicalwonders.com

              Comment

              Working...
              X