سؤال

أنا أعمل في هذه الصفحة هنا:

http://noasimon.co.il/

يبدو جيدًا في Firefox وChrome وOpera وIE8
ولكن عندما أقوم بتشغيل "عرض التوافق" في IE8، تظهر صور القائمة أسفل النص.

مشكلة أخرى تحدث فقط في هذا العرض موجودة في هذه الصفحة:
http://noasimon.co.il/exhibition2010

تنتقل الصور المصغرة إلى أقصى اليسار خارج العرض.

أحد يعرف كيف يمكنني إصلاح هذا؟لدي خبرة قليلة جدًا في هذا النوع من الأشياء.

هل كانت مفيدة؟

المحلول

.ngg-album {
    position: relative;
}
.ngg-albumimage 
img {
    position: absolute;
    left: 0;
    top: 0;
}
.ngg-albumimage {
    display: inline;
}

نصائح أخرى

تهانينا على HTML W3C-Valid! (راجعت فقط للتأكد)

لأنه يشبه div#header سيكون دائما 50px طويل ودائم في (0،0) داخل div#wrapper, ، و ال div.sidebar دائما في (0،50) ، لماذا لا تفعل هذا:

div#wrapper {
    position: relative;
}

div#wrapper div#header {
    position: absolute;
    height: 50px;
    top: 0px;
    left: 0px;
}

div#wrapper div.sidebar {
    position: absolute:
    top: 50px;
    left: 0px;
}

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

* {padding: 0 ؛ الهامش: 0 ؛}

يساعد هذا عادةً في حل مشكلات التوافق المشتركة IE المرتبطة بالقيم الافتراضية للهامش والحشو هناك.

يبدو أن هذه حالة جيدة "هامش مزدوج"

ما عليك فعله بشكل أساسي من أجل "العرض المتوافق" هو ​​الضبط display ل inline على العناصر التي تم طرحها ولها هامش.

.ngg-albumtitle {
    float: right;
    display: inline;
}

يمكنك استخدام ..

.sidebar ul {margin: 0px ؛ الحشو: 0px ؛

} .sidebar li {float: right ؛ العرض: كتلة مضمنة. الهامش: 1px ؛ Padding: 0px 4px '

حجم الخط:..؛

}

شكرا Ptiwari.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top