Jump to content

z-index issue with the article tag


Recommended Posts

Hi I have some css3 and html5 that shows some text on a notepad with pages behind see http://www.sich.co.uk/learning/index.html. When this is put into my wordpresshomepage it does not work.The problem appears to be with the z-index and should be solved by putting in a high z-index no in the article.notepad however if I do this on the test page or in wordpress site it fails. So even in the test code as soon as I put a z-index: 2; in article for instance it fails. Take it out and it works perfectly.I have been banging my head against a brick wall on this one. Any help form all you WordPress, CSS3 & html5 gurus would be appreciated. I have included the source html and then the CSS. it is exactly the same code in the wordpress site. Any thoughts would be appreciated.StumpedPaul

index.html

stylenotepad.css

Link to post
Share on other sites

There's a lot of nested divs above the notepad class. There's probably something that being inherited from one of the higher level divs. Remove the css for the divs above the notepad class then re-insert them sequentially and you'll probably find the problem. Then check back if you need to.

Edited by niche
Link to post
Share on other sites

Please confirm that the test code in the OP displays correctly without the z-index. If so, the problem may be the positioning. There's no float.

Edited by niche
Link to post
Share on other sites

Hi Niche Yes that is correct the test code works fine without the z-index. Not sure what you mean by there's no float. However I inserted a float:inherit: , float: left; and even a float:none; none of them made a jot of difference. If that helps. It's a real weird one. Thanks Paul

Edited by PHoward188
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...