Skip navigation
Currently Being Moderated

How do I make my Spry Accordion menu scroll *with* my webpage?

Apr 23, 2013 11:35 AM

Tags: #html #css #spryaccordion.js

Afternoon,

 

I'm a newbie designer, just helping a friend build a website that will incorporate her blog and other stuff, but what I'm trying to do is set up my Spry Menu (set as a vertical accordion style) to scroll with the page.

 

I want it to scroll within the confines on my div class="contentright"

 

CSS for div class:

.contentright {

    padding-top: 410px;

    float: left;

    width: 210px;

}

 

HTML of same div class:

<div class="contentright">

                            <div id="SpryAccordion1" class="Accordion" tabindex="0">

                            <div class="AccordionPanel">

                                <div class="AccordionPanelTab tabTop">

 

 

My webpage has a set width and is set to expand based on what I have in my main content area. I'm just not sure what to code and where to code it (in my HTML or in the CSS), to set my Spry to scroll. I'm assuming it's something with a .float functionality, maybe? I just need it to stay beneath my top padding so that it doesn't get overlapped by my main header logo that I had to set to position: absolute;

 

 

Any ideas?

 
Replies
  • Currently Being Moderated
    Apr 23, 2013 12:12 PM   in reply to AxiomaticChaos

    I just need it to stay beneath my top padding so that it doesn't get overlapped by my main header logo that I had to set to position: absolute;

    Absolute positioning is not necessary for 98% of what we do. It removes content from the normal document flow.  Default CSS positioning (none or static) will allow your menu to naturally fall beneath your header without additional code from you.   Keep things simple and you'll have fewer problems.

     

     

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 23, 2013 3:54 PM   in reply to AxiomaticChaos

    I'm sorry, but the code fragments you are posting don't tell us much.  It's impossible to give more complete answers without seeing a URL to the page in question.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 23, 2013 3:59 PM   in reply to AxiomaticChaos
     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points