SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member atrain's Avatar
    Join Date
    Oct 2003
    Location
    New Orleans
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question New to css. trying to experiment

    I am trying to do a site in css for the first time and came across a block. yes, there are some tables in there still, but I am going piece by piece.

    anyway, on this page the Home button won't recognize the link. but the image on top of it will. I set the z-index thing, but it seems it's not recognizing it. any suggestions?

    also, does my css just look like crap? should I just stick to tables?

  2. #2
    SitePoint Member
    Join Date
    Oct 2003
    Location
    springfield, va, usa
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    1. your 'our newest collection' GIF (including the text and the big image) is on top of the home button, therefore if you hover over the home button, you get the 'our new collection' link. you can even see the link change from 'wholesale info' to 'our new collection' as you hover on the wholesale info button and move the mouse far enough right that it is within the block defined by the our new collection div. make sense?

    2. don't give up! I was just as lost (moreso even) at first. it'll start making sense...

    3. what a FUN design!! looks great!! the only thing that doesn't totally fit in is the kay-la logo at top left. it's a tad isolated in whitespace, while everything else is so dynamic.

    4. how to fix it... that's another question. must ponder...

  3. #3
    SitePoint Member
    Join Date
    Oct 2003
    Location
    springfield, va, usa
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    btw, rereading your post, it seems you realized that the image was on top...

    I only see the z-index on the newestbag div and the smallstripes. do you need to apply a z-index to the home button? I've never used z-index, so... I dunno.

  4. #4
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="nav">
    <tbody>
    <tr class="SmallStripes"><td width="547" height="35">
    <div id="NavButtons"  style="position:absolute; z-index:10" >
    <a href="http://www.labproductions.com/kayla/web/collections.html">
    I just added some quick inline styles to the code above and it seems to work fine. I switched the inner DIV to absolute to cut it loose of the table. Ideally, you want the bar running full width on the bottom, the 'newest collection' graphic sitting on top of that, and a div containing the nav items on top of that.

    The inline styles are just a quick test method. Don't put them inline in your finished code if you can help it.

    Design looks great though and coding is fine. Good stuff.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable

  5. #5
    SitePoint Member atrain's Avatar
    Join Date
    Oct 2003
    Location
    New Orleans
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the replies and the compliments. I was mainly wanting to know if I was even on the right track. I'll try and play with it some more and see what I come up with. Glad to know I am at least going down the right road, or maybe I'm just really good at faking hit. I do like learning this new stuff, but hate feeling so lost at the same time.

    Yes I agree with the logo also. Unfortunately that was the one thing that I didn't design or have any control over.

  6. #6
    Team SitePoint AlexW's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne
    Posts
    832
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    It's actually more predicable once the tables are gone. Everything plays by the same rules then.
    Alex Walker
    SitePoint Developer
    SitePoint - Learnable


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
  •