Grow your CSS skills. Land your dream job.

CSS Table Image splicing

  • # January 14, 2009 at 10:15 pm

    I am a newbie to CSS and have searched the internet for the solution. I am sure I am using the wrong terminology for what I need. Here is waht I want to do. I want to place a menu bar on the left side of the window. I have the image split into several sections. One section is a logo, the other section is a portion of the menu bar (to be repeated as many times as needed to complete the ribbon) and a few graphics for navigation buttons. Then a tilte on the top with an image in the middle of the page. Here is a sample…There are several buttons and I need to fill the bar from the top to the bottom of the page.
    [img]http://www.windyacresranch.net/drclaw/Test.jpg[/img] From what I have read, it looks like I need to use Div basically I need a table but a table leaves a small border around so the graphics don’t line up like they should. Is there a tutorial or any help you can provide would be greatly appreciated. I am sure there are several examples but I have not found them….Thanks for your assistance!

    Rick

    # January 14, 2009 at 10:56 pm

    If I understand correctly, you actually would only need one div.

    The CSS would look like:

    Code:
    #nav {
    width: /* insert the width of your images there */px;
    background: url(location/of/your/repeating/bg.jpg) repeat-y #000;
    }

    Then the HTML for that div:

    Code:

    Of course there’s much more to it when talking about an entire site in terms of positioning, padding, margins, etc, but that should get your started at a very basic level.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".