1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

CSS Adding Sidebar Container

Discussion in 'Web Development' started by edensong, Aug 7, 2009.

  1. edensong

    edensong New Member

    I am using the fibreglass template, albeit modified for a different industry.

    Here is my test page:
    http://www.edensong.com/botanicalorganics/testpages/maintestpage.html

    (I'm just getting started on this, so all the links go to pages that look the same.)

    And the style.css location is:
    http://www.edensong.com/botanicalorganics/style.css

    I have very little experience working with css, so I'm sure there are things that could be cleaned up.

    I wish to add a right (sidebar?) container (on the outside of the main container) that extends the full length of the page to insert several trade seal icons from various organizations. It only needs to be a few pixels wide with a white border around it (I think) like the other boxes.

    Can anyone help me out? Thanks!
     
  2. edensong

    edensong New Member

    Could I get some help, please?
     
  3. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Here is the best I can figure what you want. (can't put much in a few pixels wide, so I made it 176px wide)
    I don't have time to explain but I commented the files so you can follow and fixed some coding mistakes you had. The box will grow/shrink as you add/subtract content to it. You can change the width of the box, but if you do also change the container accordingly in the css file.
     

    Attached Files:

  4. edensong

    edensong New Member

    Thank you very much, Ishkey. I'll have a look and hopefully I'll understand it! :p
     
  5. edensong

    edensong New Member

    I tried working with this edit, but it just isn't right. The far right sidebar is touching (or overlapping the page header where the menu and page title are. I'd like it to be floating and separate from the header. Is that possible?