The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Drop Down Menu showing below another <div>
ccs
post Jun 25 2013, 05:04 PM
Post #1





Group: Members
Posts: 4
Joined: 25-June 13
Member No.: 19,345



I think I messed something up in my style.css. The website that I produced shows a drop down menu that is showing below my main body tag. I believe it is css related because it's consistent across my entire site I'm building. It passes the css validator, but clearly I did something wrong. Any ideas would be appreciated. Thanks!


Attached Image


Attached File  style.css ( 6.98k ) Number of downloads: 343
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 25 2013, 05:34 PM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,403
Joined: 9-August 06
Member No.: 6



Please post the URL to the page.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ccs
post Jun 25 2013, 05:43 PM
Post #3





Group: Members
Posts: 4
Joined: 25-June 13
Member No.: 19,345



QUOTE(pandy @ Jun 25 2013, 05:34 PM) *

Please post the URL to the page.

I haven't made the site live yet. Do I need to?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 25 2013, 08:16 PM
Post #4


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,403
Joined: 9-August 06
Member No.: 6



Ok, then post the HTML also. We need to see that too.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ccs
post Jun 25 2013, 10:24 PM
Post #5





Group: Members
Posts: 4
Joined: 25-June 13
Member No.: 19,345



QUOTE(pandy @ Jun 25 2013, 08:16 PM) *

Ok, then post the HTML also. We need to see that too.

HTML added.

Attached File  index.html ( 3.52k ) Number of downloads: 353
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 26 2013, 07:16 AM
Post #6


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,403
Joined: 9-August 06
Member No.: 6



It's the positioning. Positioned boxes are automatically on top of non positioned and when all involved boxes are positioned the one that comes last in the source is on top - that's the one with the content in this case. You can change that with z-index. It's probably enough to give #sidebar any positive z-index, for instance...

CODE
#sidebar    { z-index: 100 }


http://www.w3.org/TR/CSS2/visuren.html#propdef-z-index
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ccs
post Jun 26 2013, 12:03 PM
Post #7





Group: Members
Posts: 4
Joined: 25-June 13
Member No.: 19,345



QUOTE(pandy @ Jun 26 2013, 07:16 AM) *

It's the positioning. Positioned boxes are automatically on top of non positioned and when all involved boxes are positioned the one that comes last in the source is on top - that's the one with the content in this case. You can change that with z-index. It's probably enough to give #sidebar any positive z-index, for instance...

CODE
#sidebar    { z-index: 100 }


http://www.w3.org/TR/CSS2/visuren.html#propdef-z-index





Perfect! That fixed it! Thanks so much! I was pulling my hair out on that one.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 26 2013, 01:17 PM
Post #8


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,403
Joined: 9-August 06
Member No.: 6



You are welcome. wink.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 23rd October 2019 - 12:56 AM