SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Thread: CSS scroll box

  1. #1
    Web Enthusiast
    Join Date
    Jul 2000
    Location
    Western Massachusetts, USA
    Posts
    1,383
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS scroll box

    I'm looking for an up-to-date solution for a scroll box to replace the blockquote at the top of this page: http://www.clickbasics.com/paul-carter/. Basically, I want to include several testimonials in the space occupied by the blockquote, so visitors can scroll through, instead of clicking to another page. I'll appreciate your suggestions.
    Paul C.
    ClickBasics
    http://www.clickbasics.com

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,118
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    What kind of scrolling do you envisage? up/down or horizontal?

    You could simply set a height on the blockquote (or another element like a div) and set it to overflow: auto;
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  3. #3
    Web Enthusiast
    Join Date
    Jul 2000
    Location
    Western Massachusetts, USA
    Posts
    1,383
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. That works great!

    One more challenge. I'd like there to be horizontal white space consistently between the blockquotes and the following paragraphs.
    HTML Code:
    <blockquote>At ClickBasics there is so much state-of-the-art information on how best to market one's self on the internet. It's very clearly expressed and I am now able to understand the direction I want to take. I'll be coming back often to learn more. - Beverly Haberman, <a title="Communicate for Success" href="http://beverlyhaberman.com/">Communicate for Success </a></blockquote>
    <p style="padding: 10px; background-color: #f6f6f6; border: 1px dotted navy;"><em><em>Paul helped me learn what I didn't know, the details of SEO, Paths, website strategy (detailed). —Tonio Palmer Wharton Fellows Program &amp; Independent Consultant</em></em></p>
    How do I do that?
    Paul C.
    ClickBasics
    http://www.clickbasics.com

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,118
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    I'm not really clear on why some quotes are in <blockquote>s and some in <p>s, but a quick fix might be to add this to your style sheet:

    Code:
    blockquote {margin-bottom: 10px;}
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


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
  •