Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > PHP > PHP Forum > มี ปัญหา เกี่ยวกับ CSS ครับ มัน ซ้อน กัน จะ แก้อย่างไร ลองทำมา 3 วันแล้วไม่ได้



 

มี ปัญหา เกี่ยวกับ CSS ครับ มัน ซ้อน กัน จะ แก้อย่างไร ลองทำมา 3 วันแล้วไม่ได้

 



Topic : 102159



โพสกระทู้ ( 111 )
บทความ ( 0 )



สถานะออฟไลน์




99
PHP
Code (PHP)
<tr>
      <td width="660" valign="top"><table id="Table_5" width="650" height="298" border="0" cellpadding="0" cellspacing="0">
     </tr>
      <tr>
     <td valign="top"><table width="100%"  border="0" align="center" cellpadding="0" cellspacing="0" id="Table_" >
                <tr>
                  <td width="15" height="15"><img src="images/blockcon_01.png" width="15" height="15" alt="" /></td>
                  <td height="15" style="background-image:url(images/blockcon_02.png);"></td>
                  <td width="15" height="15"><img src="images/blockcon_03.png" width="15" height="15" alt="" /></td>
                  </tr>
                <tr>
                  <td width="15" style="background-image:url(images/blockcon_04.png);"></td>
                  <td valign="top" style="padding-top:7px; padding-bottom:7px;">
                  <ul class="acc" id="acc">
       <?
$listsql="SELECT * FROM tb_link_s  ";
$listquery =mysql_query($listsql) or die ($listsql);
$num_rows = mysql_num_rows($listquery);
while($listrow = mysql_fetch_array($listquery)) {?>
                      <li>
                      <h99><?=$listrow['name_th']?></h99>
                      <div class="acc-section">
                        <div class="acc-content">
                        <table width="100%" border="0" cellspacing="0" cellpadding="0">
                         <tr>
                        <? $blistsql="SELECT * FROM tb_link where status_op ='on' and fk='".$listrow['id']."'   ";
$blistquery =mysql_query($blistsql) or die ($blistsql);
$bnum_rows = mysql_num_rows($blistquery);
$i=1;
while($blistrow = mysql_fetch_array($blistquery)) {?>
                        
                           <td width="14%" valign="top"><a href="<?=$blistrow['url']?>" target="_blank"><img src="images/link/<?=$blistrow['file']?>" width="120" height="70" /></a></td>
                       
                      
                            <td width="36%" valign="middle" style="padding-left:10px;"><span class="link-title"><?=$blistrow['name_th']?></span></td>
                          <?
							  if($i % 2==0){echo"</tr><tr>";}
                              $i++;
							  }
							  
							  ?> </tr>
                            </table>
                            </div>
                            </div>
                            </li>
                               <? } ?>
                              
                    
                               </ul>        </td>
                               
                               
                               
                  <td width="15" style="background-image:url(images/blockcon_06.png);"></td>
                  </tr>
                <tr>
                  <td width="15" height="22"><img src="images/blockcon_07.png" width="15" height="22" alt="" /></td>
                  <td height="22" style="background-image:url(images/blockcon_08.png);"></td>
                  <td width="15" height="22"><img src="images/blockcon_09.png" width="15" height="22" alt="" /></td>
                  </tr>
              </table></td>
      
      </tr>



Css
Code
* {margin:0; padding:0;} #options {width:457px; margin:20px auto; text-align:right; color:#9ac1c9} #options a {text-decoration:none; color:#9ac1c9} #options a:hover {color:#033} #acc {width:600px; list-style:none; color:#033; } #acc h99 {width:500px; border:1px solid #9ac1c9; padding:6px 6px 6px 17px; font-size:13px; font-weight:bold; margin-top:10cm; cursor:pointer; background:url(../images/header.gif); font-family:Tahoma, Geneva, sans-serif;} #acc h99:hover {background:url(../images/header_over.gif)} #acc .acc-section {overflow:hidden; background:#fff} #acc .acc-content {width:560px; padding:19px; border:1px solid #9ac1c9; border-top:none; background:#fff;} #nested {width:425px; list-style:none; color:#033; margin-bottom:15px;} #nested h99 {width:411px; border:1px solid #9ac1c9; padding:6px 6px 8px; font-size:14px; font-weight:bold; margin-top:5px; cursor:pointer; background:url(../images/header.gif)} #nested h99:hover {background:url(images/header_over.gif)} #nested .acc-section {overflow:hidden; background:#fff} #nested .acc-content {width:393px; padding:15px; border:1px solid #9ac1c9; border-top:none; background:#fff} #nested .acc-selected {background:url(../images/header_over.gif)}




ตรง หัวข้อมัน ตามตามอักษรแต่ไม่ยาวตาม ขนาด รูป ดัง ตัวอย่างรูปล่าง
มันซ้อนกัน จะแก้ยังไง ครับ ทำมา 2 วันแล้วไม่ได้สักที

ใช้ margin-top:10px ก็ไม่ขยับ

ช่วยดูทีครับ
ขอบคุณล่วงหน้าครับ



Tag : PHP, HTML/CSS







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2013-10-29 17:29:17 By : nattaphong25332533 View : 2834 Reply : 2
 

 

No. 1



โพสกระทู้ ( 1,322 )
บทความ ( 0 )

สมาชิกที่ใส่เสื้อไทยครีเอท

สถานะออฟไลน์


Code (PHP)
<!doctype html>
 
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Accordion - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
    $( "#accordion" ).accordion();
  });
  </script>
</head>
<body>
 
<div id="accordion">
  <h3>Section 1</h3>
  <div>
    <p>
    Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
    ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
    amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
    odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
    </p>
  </div>
  <h3>Section 2</h3>
  <div>
    <p>
    Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
    purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
    velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
    suscipit faucibus urna.
    </p>
  </div>
  <h3>Section 3</h3>
  <div>
    <p>
    Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
    Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
    ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
    lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
    </p>
    <ul>
      <li>List item one</li>
      <li>List item two</li>
      <li>List item three</li>
    </ul>
  </div>
  <h3>Section 4</h3>
  <div>
    <p>
    Cras dictum. Pellentesque habitant morbi tristique senectus et netus
    et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
    faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
    mauris vel est.
    </p>
    <p>
    Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
    inceptos himenaeos.
    </p>
  </div>
</div>
 
 
</body>
</html>



http://jqueryui.com/accordion/

ลองเอาไปปรับใช้ดูครับ








ประวัติการแก้ไข
2013-10-29 19:22:47
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-10-29 19:22:18 By : pokultra
 


 

No. 2



โพสกระทู้ ( 5,105 )
บทความ ( 4 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


ต้องลองปรับ ขยับ padding ทีละตัว ...
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-10-29 21:05:26 By : apisitp
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : มี ปัญหา เกี่ยวกับ CSS ครับ มัน ซ้อน กัน จะ แก้อย่างไร ลองทำมา 3 วันแล้วไม่ได้
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 00
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่