WordPress.org

1. iceq
   Member
   Posted 2 years ago #

   Hello

   I add the CSS propery overflow:visible; to my CSS, in the following, changing overflow from hidden to visible.

   .topright {
   width:641px;
   font-family:Tahoma ,Century gothic,Verdana,Tahoma,sans-serif;
   margin:0px 0px;
   float:left;
   background:url(images/topright.jpg) no-repeat;
   height:106px;
   overflow:visible;
   position:relative;
   }

   I did this to overcome the problem of the subpages in the pages navigation bar in the header, appearing behind the header's image

   This solution made the subpages appear in the front as supposed, but had a negative effect of the page scrolling horizontally a long distance beyond the blog's borders, and at the end, appear two subpages, for an unknown reason.

   You can see this problem here:
   http://cinema.al-rasid.com/

   The problems happens with IE8, FF 3.6.3, but not with Chrome.
   I tried to add z-inded:9999 to that class, bit it didnt help.

   Thank you in advance

2. Ignari
   Member
   Posted 2 years ago #

   In line 345 of style.css
   You have this:
   #menu li ul {
   left:-999em;
   }

   Remove the left value and the horizontal scrolling dissapears.

3. iceq
   Member
   Posted 2 years ago #

   Thank you very much for your help.

   Yet sadly, this solution had a negative effect of all subpages appearing by default, under their parent pages, where they should appear only when I hover the mouse over the parent pages. See the screenshot below

   http://img21.imageshack.us/i/mobibug.png/

   It happens even with chrome, which did not exhibit the problem of horizontal scrolling at all.

4. iceq
   Member
   Posted 2 years ago #

   Please answer my Q !

5. iceq
   Member
   Posted 2 years ago #

   Another week and no response

6. iceq
   Member
   Posted 1 year ago #

   THank you everybody. especially Drknowsystems. I have managed to overcome the problem with the help of Interstice Solutions:
   http://interstice.biz/

   The solution is this:

   The solution was to do the -999 to the *right*, and to also adjust the hover state to have a *right* positioning of ‘auto’ (rather than left)

   #menu li ul {
   position: absolute;
   width: 150px;
   right:-999em;
   z-index:200;
   }

   #menu li:hover ul {
   right: auto;
   display: block;
   }

Topic Closed

This topic has been closed to new replies.