Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Feb 2004
    Location
    Cincinnati, OH
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Convert from DW to using CSS

    I am brand-new to hand-coding HTML, but I am determined to quit using DW and start to use CSS and javascript that I code by hand. I have a very simple webpage that I am going to try to re-implement this weekend using CSS. Here is the webpage that I am attempting to redo:

    http://www.robinzclark.com/aboutUs.html

    I am very proficient at Java, but I am new to javascript and CSS. I want each page to have the following sections:

    header
    left side navigation bar
    two content rectangles to the right of the left side navigation bar
    footer

    In the header will be the gif logo.

    In the left side navigation bar will be ten buttons that exhibit rollover behavior.

    In one of the content rectangles will be a jpg image, in the other content rectangle will be text.

    In the footer will be a different gif logo.

    I am a bit overwhelmed with all of the CSS tutorials. Can you offer me some advice on how to accomplish this task?

    Thank you very much.

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Two options...

    There are two commonly used, simple techniques, each of which have their pros and cons:
    [list=1][*]Float the navigation section left, and set a left margin on the content section to make room.
    Pro: works with any combination of longer content, shorter nav or vice versa.
    Con: nav must be before content in the source: bad for text browsers and screen readers, bad for search engines.[*]Aboslutely position the navigation in the top left corner of a wrapper around the content an navigation sections; again, use left margin to create room.
    Pro: nav can be behind the content: good for text browsers, etc.
    Con: nav can never be longer than the content or it will spill over the footer.[/list=1]
    There are dozens more, but you'll really have to do some digging; try the sticky on top of the forum.

    Update:

    Read this article on Mezzoblue: Friday challenge; it decribes an alternative with all floats and the correct source order!
    Last edited by ronaldb66; 02-09-2004 at 03:40 PM.
    Regards,
    Ronald.
    ronaldvanderwijden.com


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •