Masalah dropdown menu...aku guna wordpress! Help! Help!

Salam putera...

aku buat satu site guna wordpress...then aku nak masukkan dropdown menu dalam wordpress tuh...so aku guna la PixoPoint Multi-level Navigation Plugin...then ada sikit masalah...

Nih site aku: http://review4free.info/

Oleh sebab aku pernah post soklan nih dekat dia punya support forum...so aku pastekan apa yg aku dapat dari sana...tp reply dia slow skit...so aku rujuk sini la plak...

Masalah 1

POST AKU

The 1st one is I add more many categories/pages on the dropdown menu. When the 1st menu row is full, the rest will appear on another row (second row)...

The problem is the background image doesn't appear on the second row...it's only appear on the 1st row...as you can see on the 2nd row the half of the menu row contains blank background...

How can i make the background appear on every extra row in case i have more than 1 row??

My css:

Code:



#pixopoint_menu1 {
  width:100%;
  height:35px;
  background:#003399 url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;
  background-position:none;
  margin:0;}
#pixopoint_menu1 ul {
  width:100%;
        height:35px;
  background:#003399 url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;
  border:none;
  margin:0;
  padding:0;
  list-style:none;
        }
#pixopoint_menu1 li {
        border:none;
  background:#003399 url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;
  color:#FFFFFF;
  line-height:35px;
  letter-spacing:0px;
  font-weight:bold;
  font-size:12px;
  padding:0;
  margin:0 0px;
  ;float:left;
  font-family:tahoma,sans-serif;
  position:relative;
  }
#pixopoint_menu1 li:hover,#pixopoint_menu1 li.sfhover {
  background:#333;
  background-position:0 60px;
  }
#pixopoint_menu1 li a {
  border:none;
  background:none;
  text-decoration:none;
  display:block;
  padding:0 12px;
  color:#FFFFFF;
  }
#pixopoint_menu1 li a:hover {
  border:none;
  background:none;
  text-decoration:none;
  color:#FFFFFF;
  background-position:100% -120px;
  }
#pixopoint_menu1 ul ul {
  position:absolute;
  left:-999em;
  top:35px;
  width:120px;
  }
#pixopoint_menu1 li:hover ul,#pixopoint_menu1 li.sfhover ul {
  left:auto;
  }
#pixopoint_menu1 ul ul li a {
  padding:4px 10px;
  text-transform:normal;
  font-variant:normal;
  }
#pixopoint_menu1 ul ul li {
  letter-spacing:0px;
  color:#fff;
  z-index:20;
  width:120px;
  font-family:helvetica,arial,sans-serif;
  font-size:11px;
  font-weight:bold;
  font-style:normal;
  background:#333;
  border-bottom:1px solid #cccccc;
  border-left:1px solid #cccccc;
  border-right:1px solid #cccccc;
  margin:0;
        opacity:0.95;
  }
#pixopoint_menu1 ul ul li a {
  line-height:22px;
  color:#ffffff;
  text-decoration:none;
  }
#pixopoint_menu1 ul ul li:hover a,#pixopoint_menu1 ul ul li.sfhover a {
  color:#FFFFFF;
  text-decoration:none;
  }
#pixopoint_menu1 ul ul li:hover li a,#pixopoint_menu1 ul ul li.sfhover li a {
  color:#ffffff;
  }
#pixopoint_menu1 ul ul li:hover li a:hover,#pixopoint_menu1 ul ul li.sfhover li a:hover {
  color:#FFFFFF;
  }
#pixopoint_menu1 ul ul li:hover,#pixopoint_menu1 ul ul li.sfhover {
  color:#FFFFFF;
  background:#4f4fdb;
  }
#pixopoint_menu1 ul ul ul li {
  font-size:1em;}#pixopoint_menu1 ul ul ul, #pixopoint_menu1 ul ul ul ul {
  position:absolute;
  margin-left:-999em;
  top:0;
  width:120px;
  }
#pixopoint_menu1 li li:hover ul,#pixopoint_menu1 li li.sfhover ul,#pixopoint_menu1 li li li:hover

ul,#pixopoint_menu1 li li li.sfhover ul {
  margin-left:120px;
  }
#pixopoint_menu1 ul ul li:hover li a,#pixopoint_menu1 ul ul li.sfhover li a {
  text-decoration:none;
  }
#pixopoint_menu1 ul ul li li:hover a,#pixopoint_menu1 ul ul li li.sfhover a {
  color:#FFFFFF;
  text-decoration:none;
  }
#pixopoint_menu1 li.pixo_search:hover {
  background:none;
  }
#pixopoint_menu1 li.pixo_search form {
  margin:0;
  padding:0;
  }
#pixopoint_menu1 li.pixo_search input {
  font-family:tahoma,sans-serif;}
#pixopoint_menu1 li.pixo_search input.pixo_inputsearch {
  width:100px;
  }
#pixopoint_menu1 li.pixo_right {
  float:right;
  }



REPLY FROM ADMIN

If you want it to work the way you want over multiple lines, then you will need to start customising the CSS to give the menu a different height (currently set to 35px).

Changing it to 70px for the following to CSS declarations may work for you (I haven't tested it):

Code:



#pixopoint_menu1 {
  width:100%;
  height:70px;
  background:#003399 url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;
  background-position:none;
  margin:0;}
#pixopoint_menu1 ul {
  width:100%;
        height:70px;
  background:#003399 url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;
  border:none;
  margin:0;
  padding:0;
  list-style:none;
        }



POST AKU

i tried to change the height value like your suggestion to 70px but only blue (003399 color) background appear. I want to make suckerfish_blue.png background image appear.

I don't change back my adjustment so you can see how it looks. Do you have any other suggestion? Now it almost take about 1 week for me to think about this problem.

So korang faham kan masalah aku....please!

------------------------------------------------------------------------------------

Masalah aku no dua

Try korang mouse over "pages" yg 2 dari kanan tuh...dia punya menu yg kuar akan ke kanan...tapi masalahnya aku ada 3 level kat situh...then dia akan terus kuar ke kanan...tapi kat kanan tuh xde space lagi...so menu yg 3rd level tuh dah lebih border belah kanan...

so cmne aku nak buat bila dia dah tau x cukup ruang..dia bley adjust kuar sebelah kiri secara auto...ke xleh buat cmni ha???

Untuk menu "Health" "pages" "uncategorized"....aku pakai code yg kat bawah nih...dia bley masukkan secara custom...

Code:



<li><a>Health</a>
  <ul>
    <li><a href="http://review4free.info/depression/">Depression</a></li>
    <li><a href="http://review4free.info/reserved/">Reserved</a></li>
    <li><a href="http://review4free.info/reserved/">Reserved</a></li>
  </ul>
</li>
<li><a href="">Pages</a>
  <ul>
    <li><a href="http://pixopoint.com/page1/">Testing For Long Sentence</a>
      <ul>
        <li><a href="http://pixopoint.com/page1/flyout/">Flyout</a>
          <ul>
            <li><a href="http://pixopoint.com/page1/flyout/test1/">Test 1</a></li>
            <li><a href="http://pixopoint.com/page1/flyout/test2/">Test 2</a></li>
            <li><a href="http://pixopoint.com/page1/flyout/test3/">Test 3</a></li>
          </ul>
        </li>
        <li><a href="http://pixopoint.com/page1/nested1/">Nested 1</a></li>
        <li><a href="http://pixopoint.com/page1/nested2/">Nested 2</a></li>
      </ul>
    </li>
    <li><a href="http://pixopoint.com/page2/">Page 2</a></li>
    <li><a href="http://pixopoint.com/page3/">Page 3</a></li>
  </ul>
</li>
<li><a href="http://review4free.info/uncategorized/">Uncategorized</a></li>



untuk soalan ko yg first, try tukar css pixopoint_menu1 jd gini:

Code:


#pixopoint_menu1 {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:url(../multi-level-navigation-plugin/images/suckerfish_blue.png);
height:70px;
margin:0;
width:100%;
}


aku xtry lg so xtau jd ke x. so ko try la. untuk yg kedua, aku rase kne edit dia pnye javascript. nt kl ade mase aku tgk.

Wohooo !!

thanks2...dah jadi skit...tapi still ada something yg x sama...

mula2 aku tukar mcm ko cakap...
tapi still x jadi...
so aku ubah "background" untuk "#pixopoint_menu1 ul"...aku buang "repeat-x" kat belakang tuh...terus jadi...

so nih css baru...slain tuh aku x tambah apa2...

Code:

#pixopoint_menu1 {
            -moz-background-clip:border;
            -moz-background-inline-policy:continuous;
            -moz-background-origin:padding;
            background:url(../multi-level-navigation-plugin/images/suckerfish_blue.png);
            height:70px;
            margin:0;
            width:100%;
}
#pixopoint_menu1 ul {
          width:100%;
          height:70px;
          [b]background:url("../multi-level-navigation-plugin/images/suckerfish_blue.png");[/b]
          border:none;
          margin:0;
          padding:0;
          list-style:none;
 }

skrg bab nak kasi background image tuh kuar dah settle...cuma skrg kalau ko perhatikan second row punya menu...dia mcm x bercantum dgn background image...dia ke bawah skit...

mayb disebabkan wujud hover punya blok yg (warna #333) x nampak kat situh...aku rasa blok hover tuh yg kacau kut...blok yg hover tuh mayb lebih besar ntah...aku x tahu sgt css nih...

dah hampir settle...cooLLL !

aku dah try macam 2-3 hari nih...
still x jadi2...

come on someone...
penting untuk aku further benda nih...
help me please...

xpham.. bleh tnjuk screenshot dan labelkn bhgian tu x?

Masalah 1:

Try tengok kat bawah...second row punya menu macam x bercantum elok dengan background dia...1st row perfect dah...perasan x??




Masalah 2:

Yang nih dah lepas border dia...paling tepi kanan tuh border dah...



kalau x clear bley rujuk site aku terus...

http://review4free.info

Aku nak cuba tolong, tapi tak leh masuk site ko bagi tu.
browser jadi hang (IE8 & FF 3.5)

Aku nak cuba tolong, tapi tak leh masuk site ko bagi tu.
browser jadi hang (IE8 & FF 3.5)

aik...
aku test dekat komp aku boleh jer untuk IE8(8.0.601.18702)...

skrg aku pun pakai firefox 3.5.5...stil ok...

aku test dengan http://browsershots.org/ pun ok...

ke aku silap buat test...
anyway thanks for the reply...