Killersites Community: Need the tabs to be "under" the #wrap - Killersites Community

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Need the tabs to be "under" the #wrap

#1 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 01:11 PM

URL: http://bit.ly/gLgj2Z

See the 3 tabs on the right side of the page? I want those to appear "under" the #wrap div. I tried using z-index, but it didn't work. What am I missing? :huh:
0

#2 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 05:24 PM

Remove the z-index from #wrap and give the .tabs a negative z-index.
Lynne
180virtual
0

#3 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 05:38 PM

That works! :) But now the jquery slide out isn't working. Do you know how I might be able to make them work together? The slide out tabs are based on this: http://tympanus.net/...query-tutorial/
0

#4 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:08 PM

Were they working before modifying the z-index?

You might need to rearrange your calls to Jquery. CSS stylesheets come before the jQuery, and the jQuery library comes before your custom script.

This post has been edited by virtual: 15 April 2011 - 06:13 PM

Lynne
180virtual
0

#5 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:12 PM

Yeah, they were working before the z-index was applied.

I have the jquery in the head appearing after the calls to CSS. What you see in the footer is related to the wp_cycle plugin that controls the slideshow on the home page.
0

#6 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:17 PM

Yes I realized that after and edited my post. I'm not quite sure what is happening but they are halfway working, they slide back in on page refresh???
Lynne
180virtual
0

#7 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:18 PM

Yeah, that part is working. Ugh.... this is killing me.

Plus, I've got issues with the bottom widget area (the part in dark gray). On long pages, the bottom gets cut off. On short pages, it displays just fine. I know it's a silly error somewhere, but I can't find it! Nevermind the fact that the whole section is supposed to sit at the bottom right on top of the footer. <_<

This post has been edited by Susie: 15 April 2011 - 06:19 PM

0

#8 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:23 PM

Are you looking at it in IE? Because I don't see your page length issue in Firefox Mac
Lynne
180virtual
0

#9 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:25 PM

No, I'm using Firefox 4. You don't see a difference between these 2 pages?

http://bit.ly/gLgj2Z

http://bit.ly/gzUAUw
0

#10 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:28 PM

Just a thought, the tabs do animate, try changing the 'marginLeft'; settings to positive. Or just wait till Ben gets here and he'll sort you out quicker than I can.... B)
Lynne
180virtual
0

#11 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:31 PM

That didn't work either. Hmmm....

Oh, Beeeennnnnn..... :P
0

#12 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:32 PM

BTW, thanks for taking a look, Lynne. I appreciate it!
0

#13 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:32 PM

Yes of course, you mean your footer doesn't stick to the bottom. Have you tried the http://ryanfait.com/sticky-footer/
Lynne
180virtual
0

#14 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:33 PM

Sorry I can't be of more help.
Lynne
180virtual
0

#15 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 06:34 PM

Actually, the footer does stick to the bottom. The part that is white and has some links on the left and the copyright stuff on the right is the footer....
0

#16 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 06:44 PM

I'm seeing this - Firefox 3.6
Posted Image
Lynne
180virtual
0

#17 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 15 April 2011 - 07:31 PM

Right - the footer at the very bottom is only 30 pixels high. That gray widget area should sit directly on top of the footer. And on long pages, the gray is cut off....you don't see the bottom dashes nor is the content properly padded....
0

#18 User is offline   virtual 

  • PipPipPipPip
  • View blog
  • Group: Advanced Member
  • Posts: 881
  • Joined: 29-December 08
  • LocationLa Jolla, California

Posted 15 April 2011 - 09:49 PM

Ok I missed the point before.
I think you might have a case of "collapsed margins".
http://www.complexsp...apsing-margins/
http://reference.sit...llapsingmargins
Lynne
180virtual
0

#19 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 16 April 2011 - 05:52 AM

I don't know....I tried adding padding and borders and it didn't work for me. If I add enough padding for it to look right on the long pages, it's too much for the ones on the short pages.

Thanks for trying, Lynne. :)
0

#20 User is offline   Susie 

  • PipPipPipPip
  • View blog
  • View gallery
  • Group: Advanced Member
  • Posts: 3,359
  • Joined: 19-December 08
  • LocationColumbus, OH

Posted 16 April 2011 - 06:06 AM

Well, I just added a 30px bottom margin to #home-bottom-widgets and it seems to have solved it. But I'm not sure if it's the correct way to do it. I hope it won't negatively affect other pages down the road...
0

#21 User is offline   grabenair 

  • PipPipPipPip
  • View blog
  • Group: Member
  • Posts: 340
  • Joined: 27-February 11
  • LocationIowa

Posted 16 April 2011 - 05:11 PM

not sure but what I do when i have a page of different lengths is make a new css rule for this document only and use the same name . That way in the cascade the new one will be at the bottom and the height only effects that page only effect that page. An example of this http://www.roxanesmarine.com
Standards will change. But your website needs to remain in serving its audience.
My Portfolio site
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users