كيف اجعل li تتمدد في الصفحة

السلام عليكم

لدينا 4 li
حددت عرض ل 3 منهم
واريد الرابعه تأخذ باقي مساحة الصفحة
كيف ذلك

كود HTML:

---

<ul>
        <li style="width: 200px">1</li>
        <li style="">2</li>
        <li style="width: 20px">3</li>
        <li style="width: 20px">4</li>
</ul>

---

ضع عرض الـ ul
100%
و اترك الـ li الذي تريد ان يتمدد بدون تحديد للعرض

اتمنى ان يفيدك .

لا تعمل

كود:

---

<ul style="width: 100%">
        <li style="width: 200px; float:left">1</li>
        <li style="float:left;>2</li>
        <li style="width: 20px; float:left">3</li>
        <li style="width: 20px; float:left">4</li>
</ul>

---

السلام عليكم

كود PHP:

---

<style type="text/css">
.me ul{
 width : 100%;
 display: none;
}
.me li {
 display:inline;
 width:200px;
 
}
.extra{
 display:inline;
}
</style>
<ul class="me">
<li class="me">1dddddddddddddddd</li>
<li class="me">2ddddddddddddddddd</li>
<li class="me">3ddddddddddddd</li>
<li class="extra">4dddddddddddddddddddddddddddddddddddddddd</li>
</ul> 


---

أيضا لا تعمل

كود:

---

<style type="text/css">
.me ul{
 width : 100%;
 display: none;
}
.me li {
 display:inline;
 width:200px;
 
}
.extra{
 display:inline;
}
</style>

<ul class="me">
<li class="me">1dddddddddddddddd</li>
<li class="me">2ddddddddddddddddd</li>
<li class="extra">3ddddddddddddd</li>
<li class="me">4ddddddd</li>
</ul>

---

اريد الحقل الثالث يأخذ كل الصفحة المتبقية حتي لو ليس به محتوي طويل

طيب انا ماليش في الي بتحكي فيه
بس حاولت اعدل وخلاص
جرب ده
انا عدلت علي الكود الاول
عن طريق الويب اكسبرشن

كود:

---

<ul> <li style="width: 200px">1</li> <li style="">2</li> <li style="width: 20px">3</li> <li style="width: 100%">4</li> </ul>

---