ugrás a tartalomhoz

Internet Explorer Probléma - Kérlek segitsetek

ekike · 2008. Dec. 19. (P), 19.51
Sziasztok!

Előre is megköszönném,ha valaki tudna nekem segiteni.
Sajnos mindkét webesem lebetegedett,és elég nagy problémám van az internet explorerrel.Egy új oldalt inditank 24 órán belül,és IE a Div-ek mögé dobálja be a lenyiló menü "almenüit".Ezen felül pedig jobbra mozgatja el a menüket oly módon,hogy arra a felhasználó nem tudf klikelni. Bemásolom talán úgy könnyebb lesz.

menu.css:
  1. /* remove the bullets, padding and margins from the lists */  
  2. #key_menu_items ul, #other_menu_items ul{  
  3. list-style-type:none;  
  4. padding:0;  
  5. margin:0;  
  6. }  
  7. /* make the top level links horizontal and position relative so that we can position the sub level */  
  8. #key_menu_items li, #other_menu_items  li{  
  9. float:left;  
  10.   
  11. z-index:100;  
  12. }  
  13.   
  14. /* use the table to position the dropdown list */  
  15. #key_menu_items table, #other_menu_items table{  
  16.   
  17. border-collapse:collapse;  
  18. z-index:80;  
  19. left:-1px;  
  20. top:25px;  
  21. }  
  22.   
  23. /* style all the links */  
  24. #key_menu_items a, #key_menu_items :visited, #other_menu_items  a, #other_menu_items :visited{  
  25. }  
  26. /* style the links hover */  
  27. #key_menu_items :hover, #other_menu_items :hover {  
  28. }  
  29.   
  30. /* hide the sub level links */  
  31. #key_menu_items ul ul, #other_menu_items ul ul {  
  32. visibility:hidden;  
  33.   
  34. width:149px;  
  35. height:0;  
  36. }  
  37. /* make the sub level visible on hover list or link */  
  38. #key_menu_items ul li:hover ul,  
  39. #key_menu_items ul a:hover ul,  
  40. #other_menu_items ul li:hover ul,  
  41. #other_menu_items ul a:hover ul{  
  42. visibility:visible;  
  43. }  
  44.   
  45. #other_menu_items ul li ul li {  
  46.     display: block;  
  47.     clear: both;  
  48.     background: #444;  
  49.     border-bottom: 2px solid #222;  
  50.     width: 150px;  
  51.     padding-left: 4px;  
  52.       
  53. }  
  54.   
  55. #key_menu_items ul li ul li {  
  56.     display: block;  
  57.     clear: both;  
  58.     background: #444;  
  59.     border-bottom: 2px solid #222;  
  60.     width: 160px;  
  61.     padding: 6px;  
  62.     font-size: 12px !important;  
  63. }  
  64.   
  65.   
  66. A CSS  
  67.   
  68. @charset "utf-8";/* CSS Document */  
  69.   
  70. body {  
  71.   
  72.     background:#000;  
  73.   
  74.     font-family: Arial, Helvetica, sans-serif;  
  75.   
  76.     font-size: 11px;  
  77.   
  78.     color: #FFFFFF;  
  79.   
  80.     margin:0;  
  81.   
  82.     padding:0;  
  83.   
  84. }  
  85.   
  86. input, select, textarea { background: #555; border: 1px solid #999; color: #ddd; }  
  87.   
  88. .more { color:#fbb03b; text-decoration:none;  font-size:0.85em; padding:0 3px; }  
  89.   
  90. .more:hover { background:#fbb03b; color:black; }  
  91.   
  92. .typo_block { position:absolute; background:#000; padding:4px; }  
  93.   
  94. .hidden { display: none; }  
  95.   
  96. .unhidden { display: block; }  
  97.   
  98. .clear { clear: both; }  
  99.   
  100.   
  101.   
  102. .orangebar { font-size: 16px; background: #f9be1f; color: #000; padding: 2px 4px; }  
  103.   
  104.   
  105.   
  106. #wrapper { width:975px; margin:0 auto; }  
  107.   
  108.   
  109.   
  110. #log_form { background:url(images/body_rounded_top.png) #1a1a1a no-repeat top left; overflow:hidden; padding:17px; text-align: right; font-size: 11px; }  
  111.   
  112. #log_form  input { background: #555; border: 1px solid #999; width: 60px; color: #ddd; font-size: 11px; }  
  113.   
  114. #log_form .label_login, #log_form .label_pass { color: #999; }  
  115.   
  116. #log_form .logged_in { font-size: 13px; }  
  117.   
  118. #log_form a, #log_form a:hover, #log_form a:active, #log_form a:visited { color: #999; text-decoration: none; margin-left: 6px;}  
  119. #log_form .userdo { float: left; }  
  120.   
  121.   
  122. #header { background:url(images/header.png) no-repeat top center; height:199px;}  
  123.   
  124.   
  125.   
  126. #body_featured_content { background:url(images/body_rounded_top.png) #1a1a1a no-repeat top left; overflow:hidden; padding:17px; }  
  127.   
  128. #body_other_content { background:url(images/body_rounded_top_light.png) #666666 no-repeat top left; overflow:hidden; padding:17px; margin-top:10px; }  
  129.   
  130.   
  131.   
  132. #footer { margin-top: 50px; font-size: 10px; text-align:center; padding:0 0 10px 0; }  
  133.   
  134.   
  135.   
  136. #main_menu { position:relative; font-size:13px;  color:#333333; }  
  137.   
  138. #main_menu a { text-decoration:none; border-bottom:3px solid transparent;  }  
  139.   
  140. #main_menu a:hover { border-bottom:3px solid #fff; }  
  141.   
  142. #main_menu #key_menu_items { position:absolute; top:155px; left:15px; font-size:16px; }  
  143.   
  144. #main_menu #other_menu_items { position:absolute; top:155px; left:350px; }  
  145.   
  146. #main_menu #key_menu_items a { color:#fff; font-weight:bold;  }  
  147.   
  148. #main_menu #other_menu_items a  { color:#aaa; }  
  149.   
  150.   
  151.   
  152. /* Generic section */  
  153.   
  154.   
  155.   
  156. .section { background:#333333; float:left; margin-right:18px; }  
  157.   
  158. .section .header { background:url(images/section_header_tile.png) repeat-x; height:63px; position:relative; }  
  159.   
  160. .section .header_right { background:url(images/section_header_tile-right.png) no-repeat right top; height:63px;  }  
  161.   
  162. .section .header  h3 { margin:0; text-indent:-300em; height:45px; position:absolute; }  
  163.   
  164. .section .content { padding:3px; }  
  165.   
  166.   
  167.   
  168. #body_other_content .section .header { background:url(images/section_header_tile_light.png) repeat-x; height:63px; position:relative; }  
  169.   
  170. #body_other_content .section .header_right { background:url(images/section_header_tile_light-right.png) no-repeat right top; height:63px;  }  
  171.   
  172. #body_other_content .section { background-color:#4d4d4d; }  
  173.   
  174.   
  175.   
  176. /* Fetured news */  
  177.   
  178.   
  179.   
  180. #kiemelt_hirek { width:405px; height: 690px; }  
  181. #kiemelt_hirek .header h3 { background:url(images/sections/kiemelt_hirek.png) no-repeat 5px top; width:200px;  }  
  182. #kiemelt_hirek .news_block2 { width:198px; position:relative; margin-bottom:5px; margin-left: 1px; float: left; }  
  183. #kiemelt_hirek .news_block2 h2 { margin:0; font-size:12px; text-decoration:blink; padding:1px;  background:#000; height: 40px; }  
  184. #kiemelt_hirek .news_block2.closed { height:150px; }  
  185. #kiemelt_hirek .news_block2.closed .news_text { display:none; }  
  186. #kiemelt_hirek .news_block2.closed h2 { position:absolute; top:120px; }  
  187. #kiemelt_hirek .news_block2.open { height:300px; background:#4d4d4d;}  
  188. #kiemelt_hirek .news_block2.open .news_text { display:block; padding:3px 10px; }/* Featured partys */  
  189.   
  190.   
  191. #kiemelt_partyk { width:280px; height:690px; }  
  192. #kiemelt_partyk .header h3 { background:url(images/sections/kiemelt_esemenyek.png) no-repeat 5px top; width:200px;  }  
  193. #kiemelt_partyk .party_block { width:270px; position:relative; margin-bottom:5px; height:200px; position:relative;}  
  194. #kiemelt_partyk .party_block .typo_block { position:absolute; bottom:0px; left: 1px; background:#000; padding:4px; }  
  195. #kiemelt_partyk .party_block .typo_block.party_date { position:absolute; bottom:auto; top:0px; background:#000; padding:4px; }  
  196. #kiemelt_partyk .party_block h2 { margin:0; font-size:16px; padding:1px; color:#fbb03b; }  
  197. #kiemelt_partyk .party_block .typo_block a { color:#fbb03b; text-decoration: none; }  
  198. #kiemelt_partyk .party_block .typo_block a:hover { background:#fbb03b; color:#000; text-decoration: none;}  
  199. #kiemelt_partyk .party_block .party_date { margin:0; font-size:11px; }  
  200. #kiemelt_partyk .party_block .party_location { margin:0; font-size:12px;  }  
  201. #kiemelt_partyk .party_block .party_location a { color: #fff;  }  
  202. #kiemelt_partyk .party_block img { border:2px solid #000; }  
  203. #kiemelt_partyk .party_block .party_location b { background:#444; padding:0 3px; }  
  204.   
  205.   
  206.   
  207. /* Featured photos */  
  208.   
  209.   
  210.   
  211. #kiemelt_fotok { width:220px; height:690px; margin-right:0; }  
  212.   
  213. #kiemelt_fotok .header h3 { background:url(images/sections/kiemelt_fotok.png) no-repeat 5px top; width:200px;  }  
  214.   
  215. .picture_block { width:220px; position:relative; margin-bottom:5px; height:200px; }  
  216.   
  217. .picture_block h2 { margin:0; font-size:16px; padding:1px; color:#fbb03b; }  
  218.   
  219. .picture_block .party_date { margin:0; font-size:11px; }  
  220.   
  221. .picture_block .party_location { margin:0; font-size:12px;  }  
  222.   
  223. .picture_block img { border:2px solid #000; }  
  224.   
  225. .picture_block .party_location b { background:#444; padding:0 3px;}  
  226.   
  227. .picture_block .typo_block { position:absolute; bottom:0px; background:#000; padding:4px; right:7px;}  
  228.   
  229. .picture_block .typo_block.party_date { position:absolute; bottom:auto; top:0px; background:#000; padding:4px; }  
  230.   
  231.   
  232.   
  233. /* News */  
  234.   
  235.   
  236.   
  237. #hirek { width:405px; }  
  238.   
  239. #hirek .header h3 { background:url(images/sections/hirek.png) no-repeat 5px top; width:200px; }  
  240.   
  241. #hirek .news_block { width:315px; height:90px; position:relative; margin-bottom:5px; }  
  242.   
  243. #hirek .news_block h2 { margin:0; font-size:14px; position:relative; left:80px; top:-65px; margin-right: 5px;}  
  244.   
  245. #hirek .news_block .news_text {  font-size:11px; text-align: justify; position:relative; left:80px; top:-65px; padding:0 10px 0 0; }  
  246.   
  247.   
  248.   
  249. /* Partyk */  
  250.   
  251.   
  252.   
  253. #partyk { width:280px;  }  
  254.   
  255. #partyk .header h3 { background:url(images/sections/partyk.png) no-repeat 5px top; width:200px;  }  
  256.   
  257. #partyk .date_separator { text-align:right; color:#999999; font-size:12px; border-bottom:1px dotted; margin:0 0 8px 0; }  
  258.   
  259. #partyk .party_block { width:270px; position:relative; margin-bottom:5px; height:110px; position:relative;}  
  260.   
  261. #partyk .party_block .inside { position:absolute;  left:100px; top:30px;  }  
  262.   
  263. #partyk .party_block h2 { margin:0; font-size:16px; padding:1px; color:#fbb03b; }  
  264.   
  265. #partyk .party_block h2 a { color:#fbb03b; text-decoration: none;}  
  266.   
  267. #partyk .party_block h2 a:hover { background:#fbb03b; color: #000; text-decoration: none;}  
  268.   
  269. #partyk .party_block .party_date { margin:0; font-size:11px; }  
  270.   
  271. #partyk .party_block .party_location { margin:0; font-size:12px;  }  
  272.   
  273. #partyk .party_block .party_location b { background:#444; padding:0 3px; }  
  274.   
  275. #partyk .party_block .party_location b a { color: #fff; text-decoration: none; }  
  276.   
  277. #partyk .party_block .party_location b a:hover { color: #000; background: #fbb03b;  text-decoration: none;}  
  278.   
  279. #partyk .party_block a img { border: 0; }  
  280.   
  281.   
  282.   
  283. /* Other Sections */  
  284.   
  285.   
  286.   
  287. #other_section_container { float:left; overflow:hidden; }  
  288.   
  289. #other_section_container .section { float:none; margin:5px 0; }  
  290.   
  291.   
  292.   
  293. /* Szavazás */  
  294.   
  295.   
  296.   
  297. #szavazas { width:220px; margin-right:0  }  
  298.   
  299. #szavazas .header h3 { background:url(images/sections/szavazas.png) no-repeat 5px top; width:200px;  }  
  300.   
  301. #szavazas .content { padding:5px; }  
  302.   
  303. #szavazas ul { list-style:none; padding:0; color:#fbb03b; }  
  304.   
  305.   
  306.   
  307. /* Partifotók */  
  308.   
  309.   
  310. #partypic { }  
  311. #partypic .header h3 { background:url(images/sections/partyk.png) no-repeat 5px top; width:200px;  }  
  312.   
  313. #partypic img, #partypic a { margin: 0; border:0; width: 100px; height: 100px; background: #000; }  
  314.   
  315. #partypic h2 { color: #FBB041; text-align: right; margin-right: 5px; margin-top: 0px; }  
  316.   
  317. #partypic .typo_block { position:absolute; bottom:0; background:#000; padding:1px; right:4px; }  
  318.   
  319. #partypic .pic_block h2 {  font-size: 9px; color:#fbb03b; }  
  320.   
  321. #partypic .pic_block p { font-size: 7px; padding: 1px; }  
  322.   
  323. #partypic .pic_block { position: relative; float: left; margin: 0;}  
  324.   
  325.   
  326.   
  327. /* Inside Content */  
  328.   
  329.   
  330.   
  331. #inside_content { background:url(images/body_rounded_top.png) #1a1a1a no-repeat top left; overflow:hidden; padding:17px; }  
  332.   
  333. #inside_content h1 { color:#fbb03b; }  
  334.   
  335. #inside_content #article_content { width: 600px; float:left; text-align:justify; font-size:12px; line-height:1.5em; padding:10px; }  
  336.   
  337. #inside_content .arcticle_picture { float:left; padding:10px; }  
  338.   
  339. #inside_content .article_link { color:#FF9900; display:block; text-decoration:none; text-align:right; }  
  340.   
  341. #inside_content .admin { background: #000; padding: 4px; color: #fbb03b; border: 2px solid #111;  text-decoration: none; margin: 8px; display: block;  }  
  342.   
  343. #inside_content .admin a { background: #000; padding: 4px; color: #fbb03b; text-decoration: none; font-weight: bold; }  
  344.   
  345. #inside_content .thanks { padding: 4px; margin: 8px; display: block; }  
  346.   
  347. #inside_content .style { padding: 4px 4px 4px 26px; background: #444; }  
  348.   
  349. #inside_content .picture_block { width:195px; position:relative; margin-bottom:5px; height:195px; float: left; }  
  350.   
  351. #inside_content .picture_block .typo_block { margin-bottom:5px;}  
  352.   
  353. #inside_content #article_misc_content { float:right; width:240px; padding:10px; }  
  354.   
  355. #inside_content #article_misc_content #avatar_div { width:100px; padding:5px; text-align:center; float:left; }  
  356.   
  357. #inside_content #article_misc_content h3 { margin:0; font-size:13px; color:#999999; }  
  358.   
  359. #inside_content #article_misc_content ul { list-style:none; padding:5px 0 5px 10px; font-size:14px;}  
  360.   
  361. #inside_content #article_misc_content li { padding:1px 0;}  
  362.   
  363. #inside_content #article_misc_content a { color:#FF9900; display:block; text-decoration:none;  }  
  364.   
  365. #inside_content #article_misc_content a:hover { text-decoration:underline }  
  366.   
  367. #inside_content .party_block { width:265px; position:relative; margin: 0 35px 35px 0; height:200px; position:relative; float: left; text-align: left;}  
  368.   
  369. #inside_content .party_block .typo_block { position:absolute; bottom:0px; background:#000; padding:4px; }  
  370.   
  371. #inside_content .party_block .typo_block.party_date { position:absolute; bottom:auto; top:0px; right:0px; background:#000; padding:4px; }  
  372.   
  373. #inside_content .party_block h2 { margin:0; font-size:16px; padding:1px; color:#fbb03b; }  
  374.   
  375. #inside_content .party_block .party_date { margin:0; font-size:11px; }  
  376.   
  377. #inside_content .party_block .party_location { margin:0; font-size:12px;  }  
  378.   
  379. #inside_content .party_block .party_location a { margin:0; font-size:12px;  color: #fff;}  
  380.   
  381. #inside_content .party_block img { border:2px solid #000; }  
  382.   
  383. #inside_content .party_block .party_location b { background:#444; padding:0 3px; }  
  384.   
  385.   
  386.   
  387. #inside_content .search_box { background: #222; display: block; border: 1px solid #333; width: 290px; float: left; }  
  388.   
  389. #inside_content .bio_box { background: #555; }  
  390.   
  391. #inside_content a { color:#fbb03b; text-decoration:none;  font-size:0.85em; padding:0 3px; }  
  392.   
  393. #inside_content a:hover { background:#fbb03b; color:black; }  
  394.   
  395. #inside_content .gallery a:hover { background: none; border: 0; }  
  396.   
  397. #inside_content .dj_box { width: 560px; margin-top: 60px; padding: 10px; padding-bottom: 2px; background: #222; border: 1px solid #333; }  
  398.   
  399. #inside_content span.bio { display: block; clear: both; }  
  400.   
  401. #inside_content span.dj_name { padding: 12px; float: left; display: block; height: 80px; font-size: 20px; text-align: center; width: 350px; color: #fbb03b; font-weight; }  
  402.   
  403. #inside_content .dj_box textarea { background: #222; border: 0; width: 540px; }  
  404.   
  405. #inside_content .img_block {float: left; margin-right: 20px; }  
  406.   
  407. #inside_conten a:hover: {background:none;}  
  408.   
  409. #inside_content .pn_block { background: #222; border: 1px solid #333; display: block; clear:both; min-height: 180px; padding: 16px; }  
  410.   
  411. .pn_block .feher  a { background: none; }  
  412.   
  413. .pn_block .feher  a:hover { background: none; }  
  414.   
  415. #inside_content .comments { padding: 8px; }  
  416.   
  417.   
  418.   
  419. #inside_content .mixes { background: #444;}  
  420.   
  421.   
  422.   
  423. #inside_content .picevent_block { height: 250px; float: left; margin: 6px; }  
  424.   
  425. #inside_content .picevent_block  .eventdate { display: block; color: #fbb03b; font-weight: bold; position: relative; bottom: 36px; right: 0; z-index: 5; padding: 4px; background: #000;}  
  426.   
  427. #inside_content .picevent_block img {position: relative; top: 0; left: 0; border: 2px solid #000;}  
  428.   
  429.   
  430.   
  431. .big_orange { font-size: 20px; color: #FBB041; font-weight: bold; text-align: left; }  
  432.   
  433. .big_orange  a { background: none; }  
  434.   
  435. .big_orange :hover { background: none; color: #000;}  
  436.   
  437.   
  438.   
  439. .interju {  }  
  440.   
  441. .interju h2 {font-size: 12px; margin-top: -0.2em; padding-bottom: 20px; display: block; }  
  442.   
  443. .interju img.main_pic { float: left; margin: 6px 10px;}  
  444.   
  445. .interju .pic_block { clear: both; padding: 0; margin:0; }  
  446.   
  447. .interju .pic_block { margin-right: 4px; }  
  448.   
  449. .interju p.click { clear:both; display: block; width: 100%; background: #444; padding: 4px; margin-top: 16px;}  
  450.   
  451. .interju ul { margin: 10px; 0 list-style: none }  
  452.   
  453. .interju li { display: inline }  
  454.   
  455.   
  456.   
  457. .party_details {  }  
  458.   
  459. .party_details h2 {font-size: 12px; margin-top: -1.2em; padding-bottom: 20px; display: block; }  
  460.   
  461. .party_details img.main_pic { float: left; margin: 6px 10px; border: 0;}  
  462.   
  463. .party_details .text {}  
  464.   
  465. .party_details p.click { clear:both; display: block; width: 100%; background: #444; padding: 4px; margin-top: 16px;}  
  466.   
  467. .party_details ul { margin: 10px; 0 list-style: none }  
  468.   
  469. .party_details li { display: inline }  
  470.   
  471.   
  472.   
  473. .sect_interju { margin-bottom: 6px; background: #333; padding: 1px 8px; }  
  474.   
  475. .sect_interju h1 {font-size: 18px; }  
  476.   
  477. .sect_interju h2 {font-size: 11px; margin-top: -0.2em; padding-bottom: 6px; display: block; }  
  478.   
  479. .sect_interju img.main_pic { float: left; margin: 6px 10px;}  
  480.   
  481. .sect_interju p.click { clear:both; display: block; width: 100%; background: #444; padding: 4px; margin-top: 16px; margin-bottom: 20px;}  
  482.   
  483.   
  484.   
  485. .userlist { margin-bottom: 6px; background: #333; padding: 8px; }  
  486.   
  487. .userlist img { float: left; margin: 6px 10px; width: 100px; height: 100px;  }  
  488.   
  489. .userlist .nick, .userlist .email { background: #FBB041; color: #000; }  
  490.   
  491. .userlist .pn_box {}  
  492.   
  493. .userlist .pn_box .pn_text { position: relative; right: 6px; color: #444; font-size: 30px;  }  
  494.   
  495. .userlist .pk { clear: both; background: #222; padding: 4px; }  
  496.   
  497. .userlist .nick  em { position: absolute; font-size: 36px; font-style: normal; padding-bottom: 6px; padding-left: 4px; display: block; font-weight: bold; }  
  498.   
  499. .userlist .email { text-align: right; }  
  500.   
  501.   
  502.   
  503. .mix_block {}  
  504.   
  505. .mix_block img.flag { float: left; width: 20px; height: 20px;}  
  506.   
  507. .mix_block  h2.nev { color: #FBB041; font-size: 20px;}  
  508.   
  509.   
  510.   
  511. .video_block { clear: both; margin-top: 40px;  }  
  512.   
  513. .video_block img.flag {float: left; width: 20px; height: 20px; }  
  514.   
  515. .video_block img.main_pic { float: left; }  
  516.   
  517. .video_block h2.nev { color: #FBB041; font-size: 20px; }  
  518.   
  519.   
  520.   
  521. .sect_video { clear: both; margin-top: 20px; background: #333; padding: 8px; }  
  522.   
  523. .sect_video h1 { background: transparent; color: #000; font-size: 14px; }  
  524.   
  525. .sect_video h2 { font-size: 12px; }  
  526.   
  527.   
  528.   
  529.   
  530.   
  531. #kulflyers {  
  532.   
  533.     position: relative;  
  534.   
  535.     float: left;  
  536.   
  537.     background: #f9be1f;  
  538.   
  539.     margin: 0 6px;  
  540.   
  541.     background-color: #fbb03b;  
  542.   
  543. }  
  544.   
  545. #kulflyers h2, #kulflyers img { margin: 0 6px; border: 0; background-color:#fbb03b; font:tahoma; font-size:12px; text-align:center  }  
  546.   
  547.   
  548.   
  549. .sect_comment { background: #333; margin-bottom: 6px; }  
  550.   
  551. .sect_comment img { float: left; width: 100px; height:100px; }  
  552.   
  553. .sect_comment .head { background: #000; color: #FFB041; padding: 2px; }  
  554.   
  555.   
  556.   
  557. #comment_form textarea { width: 580px; height: 120px; display: block }  
  558.   
  559. #comment_form input { display: block; margin: 4px auto; }  
  560.   
  561. #comment_form input[type="hidden"] { display: none; }  
  562.   
  563.   
  564.   
  565. #kiem_interju { clear: both; padding: 0 6px; margin: 0; }  
  566.   
  567. #kiem_lemez { clear: both; padding: 0 6px; margin: 0;}  
  568.   
  569. #kiem_partyut { clear: both; padding: 0 6px; margin: 0; }  
  570.   
  571. .sect_kiemcuccos { margin: 0;  padding: 0; }  
  572.   
  573. .sect_kiemcuccos h1 { font-size: 13px;  background: #fbb03b; color: #000; margin-bottom:0;  }  
  574.   
  575. .sect_kiemcuccos h2 { font-size: 11px; margin: 2px 0; background: #000; padding: 2px 2px 2px 4px; }  
  576.   
  577. .sect_kiemcuccos a { color: #fff; text-decoration: none; }  
  578.   
  579. .sect_kiemcuccos .intro { background: #4d4d4d; padding-bottom: 2px; }  
  580.   
  581. .sect_kiemcuccos .intro a { color:#fbb03b; }  
  582.   
  583. .sect_kiemcuccos .intro a:hover { color:#000; }  
  584.   
  585. .sect_kiemcuccos img.main_pic { float: left; margin: 0 10px 0 0; border: 2px solid #fbb03b; }  
  586.   
  587. .sect_kiemcuccos p.clear { display: none }  
  588.   
  589. #kiem_interju img { border-bottom: 0; }  
  590.   
  591. #kiem_lemez img { border-bottom: 0 }  
HTML TPL
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2.   
  3. <html xmlns="http://www.w3.org/1999/xhtml"><head>   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  4.   
  5.     <title>partynews.hu</title>   
  6.   
  7.     <link href="partynews.css" rel="stylesheet" type="text/css" />  
  8.   
  9.   
  10.   
  11.     <link href="menu.css" rel="stylesheet" type="text/css" />  
  12.   
  13.     <script src="javascripts/jquery.js" type="text/javascript"></script>  
  14.   
  15.     <script src="javascripts/partynews.js" type="text/javascript"></script>  
  16.   
  17.     <style type="text/css">  
  18. <!--  
  19. @import url("file:///H|/partynews/menu2.css");  
  20. @import url("file:///C|/Users/Gyuris Anna/Desktop/menu.css");  
  21. -->  
  22.     </style>  
  23.     </head>  
  24. <body>    <div id="wrapper">  
  25.   
  26.     <div id="header">   
  27.   
  28.         <div id="main_menu">   
  29.   
  30.             <div id="key_menu_items"> <ul>  
  31.   
  32.             <li><a href="/_new">Home</a> </li>  
  33.   
  34.           <li>&nbsp|&nbsp <a href="?op=event">Program</a> <!--[if lte IE 6]><table><tr><td><![endif]-->  
  35.   
  36.                 <ul>  
  37.   
  38.                 <li><a href="?op=event">Programok, rendezvények</a></li>  
  39.   
  40.                 <li><a href="?op=picevent">Képes programajánló</a></li>  
  41.                 </ul>  
  42.             </li>  
  43.   
  44.             <li>&nbsp|&nbsp <a href="?op=partypics">Beszámolók</a></li>   
  45.               
  46.           <li><a href="?op=mixes">Keresés</a> <!--[if lte IE 6]><table><tr><td><![endif]-->  
  47.   
  48.                 <ul>  
  49.   
  50.                 <li><a href="?op=mixes">Mixek</a></li>  
  51.   
  52.                 <li><a href="?op=videos">Videók</a></li>  
  53.                   
  54.                 <li><a href="?op=tracks">Track-ek</a></li>  
  55.                 </ul>  
  56.             </ul>  
  57.   
  58.             </div>   
  59.   
  60.             <div id="other_menu_items"> <ul>  
  61.   
  62.             <li><a href="?op=style&sub=1&style=mind">Mixek</a>  <!--[if lte IE 6]><table><tr><td><![endif]-->  
  63.   
  64.                 <ul>  
  65.   
  66.                 <li> <a href="?op=style&sub=1&style=techno">techno</a></li>  
  67.   
  68.                 <li> <a href="?op=style&sub=1&style=eeelectro">eeelectro</a></li>  
  69.   
  70.                 <li> <a href="?op=style&sub=1&style=minimal">minimal</a></li>  
  71.   
  72.                 <li> <a href="?op=style&sub=1&style=darktechno">darktechno</a></li>  
  73.   
  74.                 <li> <a href="?op=style&sub=1&style=hardtechno">hardtechno</a></li>  
  75.   
  76.                 <li> <a href="?op=style&sub=1&style=tech-house">tech-house</a></li>  
  77.   
  78.                 <li> <a href="?op=style&sub=1&style=house">house</a></li>  
  79.   
  80.                 <li> <a href="?op=style&sub=1&style=trance">trance</a></li>  
  81.   
  82.                 <li> <a href="?op=style&sub=1&style=progressive_house">progressive house</a></li>  
  83.   
  84.                 <li> <a href="?op=style&sub=1&style=goa_psychedelic">goa/psychedelic</a></li>  
  85.   
  86.                 <li> <a href="?op=style&sub=1&style=hardcore">hardcore</a></li>  
  87.   
  88.                 <li> <a href="?op=style&sub=1&style=drum_and_bass">drum&bass</a></li>  
  89.   
  90.                 <li> <a href="?op=style&sub=1&style=dance">dance</a></li>  
  91.   
  92.                 <li> <a href="?op=style&sub=1&style=chillout">chillout</a></li>  
  93.   
  94.                 <li> <a href="?op=style&sub=1&style=hardstyle">hardstyle</a></li>  
  95.   
  96.                 <li> <a href="?op=style&sub=1&style=breakbeat">breakbeat</a></li>  
  97.   
  98.                 <li> <a href="?op=style&sub=1&style=deep_house">deep house</a></li>  
  99.   
  100.                 <li> <a href="?op=style&sub=1&style=hip_hop">hip-hop</a></li>  
  101.   
  102.                 <li> <a href="?op=style&sub=1&style=mind">összes stílus</a></li>  
  103.                 </ul>  
  104.             </li>  
  105.   
  106.             <li><a href="?op=videos">Videók</a></li>  
  107.   
  108.             <li>&nbsp|&nbsp <a href="?op=tracks">Zenehallgatás</a></li>  
  109.   
  110.           <li>&nbsp|&nbsp <a href="?op=djlist">DJ lista</a>  <!--[if lte IE 6]><table><tr><td><![endif]-->  
  111.   
  112.                 <ul>  
  113.   
  114.                 <li> <a href="?op=djlist&sub=&c=1">ABCDE</a></li>  
  115.   
  116.                 <li> <a href="?op=djlist&sub=&c=2">FGHI</a></li>  
  117.   
  118.                 <li> <a href="?op=djlist&sub=&c=3">JKLMNO</a></li>  
  119.   
  120.                 <li> <a href="?op=djlist&sub=&c=4">PQRSTU</a></li>  
  121.   
  122.                 <li> <a href="?op=djlist&sub=&c=5">VWXYZ</a></li>  
  123.   
  124.                 <li> <a href="?op=djlist&sub=&c=6">#szám#</a></li>  
  125.                 </ul>  
  126.             </li>  
  127.   
  128.             <li>&nbsp|&nbsp <a href="?op=lemez&sub=all">Lemezajánlók</a></li>  
  129.   
  130.             <li>&nbsp|&nbsp <a href="?op=interju&sub=all">Interjúk</a></li>  
  131.   
  132.             <li>&nbsp|&nbsp <a href="?op=partyut&sub=all">Partyút</a></li>  
  133.   
  134.             </ul>  
  135.   
  136.             </div>   
  137.   
  138.         </div>   
  139.   
  140.        </div>   
  141.   
  142.   {LOGIN}        <div id="body_featured_content">                     <!-- Section: Kiemelt hirek -->   
  143.   
  144.            <div id="kiemelt_hirek" class="section">   
  145.   
  146.             <div class="header">   
  147.   
  148.                 <h3>Kiemelt hirek</h3>   
  149.   
  150.                    <div class="header_right">&nbsp;</div>   
  151.   
  152.                </div>   
  153.   
  154.                <div class="content">{SECT_KIEM_HIR}                </div>   
  155.   
  156.                  
  157.   
  158.                <div id="kiem_interju">  
  159.   
  160.                     {SECT_INTERJU}  
  161.   
  162.                </div>  
  163.   
  164.                 <div id="kiem_lemez">  
  165.   
  166.                     {SECT_LEMEZ}  
  167.   
  168.                </div>  
  169.   
  170.                <div id="kiem_partyut">  
  171.   
  172.                     {SECT_PARTYUT}  
  173.   
  174.                </div>  
  175.   
  176.            </div>   
  177.   
  178.            <!-- End of section: Kiemelt hirek -->   
  179.   
  180.               
  181.   
  182.            <!-- Section: Kiemelt partyk -->   
  183.   
  184.            <div id="kiemelt_partyk" class="section">   
  185.   
  186.             <div class="header">   
  187.   
  188.                 <h3>Kiemelt partyk</h3>   
  189.   
  190.                    <div class="header_right">&nbsp;</div>   
  191.   
  192.                </div>   
  193.   
  194.                                <div class="content">   
  195.   
  196.                                    {SECT_KIEM_ESEM}                </div>   
  197.   
  198.             <div id="kulflyers">  
  199.   
  200.                 <h2 class="orangebar">A HÉT KÜLÖNLEGES ESTJEI</h2>  
  201.   
  202.                 <a href="http://wwww.partynews.hu/flyers/kul_flyer1.jpg"><img src="http://www.partynews.hu/viewimg.php?mode=crop&size=118x172&image=flyers/kul_flyer1.jpg" /></a>  
  203.   
  204.                 <a href="http://wwww.partynews.hu/flyers/kul_flyer1.jpg"><img src="http://www.partynews.hu/viewimg.php?mode=crop&size=118x172&image=flyers/kul_flyer2.jpg" /></a>  
  205.   
  206.             </div>  
  207.   
  208.            </div>   
  209.   
  210.            <!-- End of section: Kiemelt partyk -->   
  211.   
  212.            <!-- Section: Kiemelt fotok -->   
  213.   
  214.            <div id="kiemelt_fotok" class="section">   
  215.   
  216.             <div class="header">   
  217.   
  218.                 <h3>Friss fotók</h3>   
  219.   
  220.                    <div class="header_right">&nbsp;</div>   
  221.   
  222.                </div>   
  223.   
  224.                                <div class="content">   
  225.   
  226.                                    {SECT_KIEMPARTIFOTO}                </div>   
  227.   
  228.            </div>   
  229.   
  230.            <!-- End of section: Kiemelt fotok -->   
  231.   
  232.                    </div>   
  233.   
  234.        <div id="body_other_content">   
  235.   
  236.                     <!-- Section:hirek -->   
  237.   
  238.            <div id="hirek" class="section">   
  239.   
  240.             <div class="header">   
  241.   
  242.                 <h3>Hirek</h3>   
  243.   
  244.                    <div class="header_right">&nbsp;</div>   
  245.   
  246.                </div>   
  247.   
  248.                                <div class="content">   
  249.   
  250.                                     {SECT_HIR}                </div>   
  251.   
  252.            </div>   
  253.   
  254.            <!-- End of section: Hirek-->   
  255.   
  256.                            <!-- Section: Partyk -->   
  257.   
  258.            <div id="partyk" class="section">   
  259.   
  260.             <div class="header">   
  261.   
  262.                 <h3>Partyk</h3>   
  263.   
  264.                    <div class="header_right">&nbsp;</div>   
  265.   
  266.                </div>   
  267.   
  268.                                <div class="content">   
  269.   
  270.                                     <!-- Separator for partys with different dates -->   
  271.   
  272.                                                           {SECT_ESEM}                </div>   
  273.   
  274.            </div>   
  275.   
  276.            <!-- End of section: Partyk -->            <div id="other_section_container">   
  277.   
  278.                <!-- Section: Szavazás -->     <div id="partypic" class="section">           <div class="header">              <h3>Partifotók</h3>             <div class="header_right">&nbsp;</div>          </div>            <div class="content">         {SECT_PARTIFOTO}            </div>        </div>   
  279.   
  280.                <div id="szavazas" class="section">   
  281.   
  282.                    <div class="header">   
  283.   
  284.                        <h3>Szavazás</h3>   
  285.   
  286.                        <div class="header_right">&nbsp;</div>   
  287.   
  288.                    </div>   
  289.   
  290.                                        <div class="content">   
  291.   
  292.                        Milyen stílusú mixeket látnál szívesen a <i>partynews.hu</i>   
  293.   
  294. oldalon?                        <form action="" method="get">   
  295.   
  296.                         <ul>                              <li><input name="" type="radio" value="" />   
  297.   
  298. Progressive</li>                              <li><input name="" type="radio" value="" />   
  299.   
  300. Techno</li>                               <li><input name="" type="radio" value="" />   
  301.   
  302. Trance</li>                               <li><input name="" type="radio" value="" />   
  303.   
  304. Goa</li>                              <li><input name="" type="radio" value="" />   
  305.   
  306. Drum &amp; Bass</li>                          </ul>   
  307.   
  308.                                                        </form>   
  309.   
  310.                                                </div>   
  311.   
  312.                </div>   
  313.   
  314.                <!-- End of section: Szavazás -->   
  315.   
  316.                <!-- Section: Szavazás -->   
  317.   
  318.                <div id="szavazas" class="section">   
  319.   
  320.                    <div class="header">   
  321.   
  322.                        <h3>Szavazás</h3>   
  323.   
  324.                        <div class="header_right">&nbsp;</div>   
  325.   
  326.                    </div>   
  327.   
  328.                                        <div class="content">   
  329.   
  330.                        Milyen stílusú mixeket látnál szívesen a <i>partynews.hu</i>   
  331.   
  332. oldalon?                        <form action="" method="get">   
  333.   
  334.                         <ul>                              <li><input name="" type="radio" value="" />   
  335.   
  336. Progressive</li>                              <li><input name="" type="radio" value="" />   
  337.   
  338. Techno</li>                               <li><input name="" type="radio" value="" />   
  339.   
  340. Trance</li>                               <li><input name="" type="radio" value="" />   
  341.   
  342. Goa</li>                              <li><input name="" type="radio" value="" />   
  343.   
  344. Drum &amp; Bass</li>                          </ul>   
  345.   
  346.                                                        </form>   
  347.   
  348.                                                </div>   
  349.   
  350.                </div>   
  351.   
  352.                <!-- End of section: Szavazás -->   
  353.   
  354.                         </div>   
  355.   
  356.                </div>   
  357.   
  358.        <div id="footer">   
  359.   
  360.            &copy; 2008. partynews.hu. <br/>   
  361.   
  362.            A tartalom csak a szerkesztők engedélyével felhasználható... (ide kell a jobb szöveg)   
  363.                   </div>   
  364.   
  365.        </div>   
  366.   
  367.        </body></html>  
JS
  1. news_swapper = {  
  2.     current_news:null,  
  3.       
  4.     create_ids_for_news:function() {  
  5.         $("#kiemelt_hirek div.news_block").each( function(idx, el) {  
  6.             el.id ="featured_news_item_" + idx;  
  7.             $(el).mouseover( function(el) {  
  8.                 news_swapper.change_active_news(this)  
  9.             })  
  10.         })  
  11.         this.current_news = $("#kiemelt_hirek div.news_block.open")[0].id;  
  12.     },  
  13.       
  14.     change_active_news:function( new_active_news ) {  
  15.         if (this.current_news != new_active_news.id) {  
  16.             var old_open_news_item = $("#kiemelt_hirek #"+this.current_news)  
  17.             var new_active_news_item = $(new_active_news)  
  18.               
  19.             $(old_open_news_item).removeClass( "open" )  
  20.             $(old_open_news_item).addClass( "closed" )        
  21.               
  22.             $(new_active_news_item).addClass( "open" )        
  23.       
  24.             $(new_active_news_item).removeClass( "closed" )  
  25.               
  26.             this.current_news = new_active_news.id  
  27.         }  
  28.           
  29.     }  
  30. }  
  31.   
  32. $(document).ready(function () {  
  33.     news_swapper.create_ids_for_news();  
  34. });  
Pls valaki. Tisztelettel előre is köszönöm.
Anna
‹ Stíluslap "kikapcsolása" JavaScripttel Meghatarozott vegzodes keszites webcim eseten - Script- Help ›
 ■
1

Mókának jó

Török Gábor · 2008. Dec. 19. (P), 21.11
Kellemetlen, hogy megbetegedtek a webeseid, de remélem te sem gondolod komolyan, hogy lesz bárki is, aki a közel 600 soros CSS-ből kibányássza, hogy mi nem működik. Ha adnál egy működő demót, ahol látható a probléma, könnyebb lenne segíteni.
2

Elnézést :=

ekike · 2008. Dec. 19. (P), 21.35
http://www1.partynews.hu/ vagy www.partynews.hu/_new
Csak explorerrel.

Köszönöm előre is.
3

Firefoxon is teszteljétek még

Dualon · 2008. Dec. 19. (P), 22.14
Szerintem nézzetek rá még FF alatt is (Ubuntu 7.04, FF3.0.5) úgy, hogy egy picit megnövelitek a betűméretet.
Ha kell, küldök screenshotot is.
4

Köszönöm

ekike · 2008. Dec. 19. (P), 22.17
Megköszönném! info##kukac##partynews.hu
Köszi amúgy az a bug is képben van(emlékeim szerint) de ez az ie még a BETA indulást is gátolja :(
7

Screenshotot elküldtem...

Dualon · 2008. Dec. 20. (Szo), 19.06
Küldtem a levelet képpel. :)
5

position:relative

Poetro · 2008. Dec. 19. (P), 22.32
Amit tehetsz, az az, hogy a #header-nek adsz egy
  1. #header { position: relative; z-index: 10; }  
-et, ami gyogyitja az ala hullast, bar ettol meg a menu nem fog tokeletesen mukodni koszonhetoen a rajta levo "lyukaknak" ami fole ha az eger kerul, eltunik a menu. Ennek javítására:
  1. #key_menu_items li, #other_menu_items  li { margin: 0; }  
Meg ha mar itt tartunk, akkor mas hibak is vannak, pl az IE nem szereti, ha a position: absolute; melle nincs top, illetve left attributum megadva, de ezt gondolom latod te is. Ezt a kovetkezo modositasaval lehet orvosolni:
  1. #key_menu_items ul ul, #other_menu_items ul ul { top: 1em; left: 0; }  
6

Köszönöm

ekike · 2008. Dec. 19. (P), 22.54
Próbálom probálom :)