لا يمكن ترتيب الصفوف في جدول بـ HTML

المشكلة لديك في ترتيب الأكواد التالية 

<tr>
  <td rowspan="2">Monsters</td>
  <td rowspan="2"><img src="https://via.placeholder.com/40/000"></td>
  <td rowspan="2">Mohamed Hany</td>
  <td rowspan="2">m@nn.sa</td>
  <td rowspan="2">&reg;</td>
  <td rowspan="2"><a href="#">Profile</td>
</tr>

لقد عالجت لك المشكلة في وضع أكواد الصف الثاني داخل  وسم tbody آخر ليظهر بالشكل المطلوب تنفيذه ، بهذا الشكل 

<tbody>
  <tr>
    <td rowspan="2">Monsters</td>
    <td rowspan="2"><img src="https://via.placeholder.com/40/000"></td>
    <td rowspan="2">Mohamed Hany</td>
    <td rowspan="2">m@nn.sa</td>
    <td rowspan="2">&reg;</td>
    <td rowspan="2"><a href="#">Profile</td>
  </tr>
</tbody>

حاول دائماً ترتيب الأكواد ليسهل عليك فهم المشكلة ، يمكنك الاطلاع على النتيجة أرفقت لك الملف بعد التعديل index.html .

يمكنك أن تستخدم أكثر من عنصر tbody كما وضح المدرب أسامة، ويمكنك أن تستخدم الصفوف فقط للقيام بهذه المهمة أيضًا، على النحو التالي:

<table border="2" width="100%">
    <thead>
        <tr>
            <th>Group</th>
            <th>Avatar</th>
            <th>Name</th>
            <th>Email</th>
            <th>Character</th>
            <th>Profile</th>
        </tr>
    </thead>
    <tbody>

        <!-- المجموعة الأولى -->
        <tr>
            <td rowspan="3">Ninja</td>
            <td rowspan="2"><img src="https://via.placeholder.com/40/f00" alt=""></td>
            <td rowspan="2">Osama mohamed</td>
            <td>o1@nn.sa</td>
            <td rowspan="2">@</td>
            <td rowspan="2"><a href="#">Profile</a></td>
        </tr>
        <tr>
            <td>o2@nn.sa</td>
        </tr>
      
        <tr>
            <td><img src="https://via.placeholder.com/40/00f" alt=""></td>
            <td>Saed Zareef</td>
            <td>S@nn.ss</td>
            <td>&trade;</td>
            <td><a href="#">Profile</a></td>
        </tr>
      
        <!-- المجموعة الثانية -->
        <tr>
            <td>Monsters</td>
            <td><img src="https://via.placeholder.com/40/000" alt=""></td>
            <td>Mohamed Hany</td>
            <td>m@nn.sa</td>
            <td>&reg;</td>
            <td><a href="#">Profile</a></td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="5">Total members </td>
            <td>3</td>
        </tr>
    </tfoot>
</table>

لاحظ كيف أن كل صف tr في المجموعة الأولى يحتوي على عدد معين من عناصر td، وذلك للسماح للخلايا بالتوسع وأخذ مساحة أكثر من صف rowspan.

شكرا جدا علي تقديمكم للمساعده

وانا توصلت لحل تالت وهو اني احذف خاصية الrowspan لآخر صفين وتتحل المشكله