/* supplement.css — точечные добавки к теме (заполняется в Фазах 2–4) */ /* ============================================================================ iwantaje.net — flow normalization (Phase 2) Оригинальный дизайн 2009 г. свёрстан ЦЕЛИКОМ на position:absolute с per-page hardcoded pixel-координатами (#bnavlp/#box*/#bnavtpl top:NNNpx, калиброванными под длину контента каждой конкретной страницы). Это несовместимо ни с общим include-футером, ни с динамическим шаблоном статьи (контент иной длины наезжает на футер / оставляет дыру). Нейтрализуем абсолют → нормальный поток: masthead → nav-бар → контент → промо-боксы → footer стекаются вертикально, ничего не перекрывается, showLinks/showSitewide и футер рендерятся корректно на всех страницах. Ховер-дропдауны меню (.menu ul ul) остаются absolute — их не трогаем. ========================================================================== */ #wrapper { position: relative; height: auto; overflow: visible; } /* декоративные absolute-«тени» (пустые img) — прочь */ #shadow, [class*="shadow5"], [class*="shadow9"], [class*="shadow11"] { display: none; } #ddsearch { display: none; } /* masthead в потоке уже; nav-бар — из absolute в статичный бар под шапкой */ #top-nav { position: static; top: auto; left: auto; width: 100%; height: auto; min-height: 34px; overflow: visible; clear: both; } #top-nav .menu, .menu { float: none !important; width: 100% !important; max-width: 100%; } #top-nav .menu > ul, .menu > ul { display: flex; flex-wrap: nowrap; align-items: stretch; list-style: none; margin: 0; padding: 0; } #top-nav .menu > ul > li, .menu > ul > li { float: none !important; position: relative; top: 0 !important; width: auto !important; flex: 0 0 auto; margin: 0 !important; padding: 0 14px 0 22px; line-height: 34px; white-space: nowrap; } /* дропдауны остаются absolute относительно li */ .menu ul ul { top: 34px !important; left: 0 !important; } /* пустой на контентных страницах баннер (Flash — только на главной) */ #inner-banner { position: static; top: auto; left: auto; width: 100%; height: auto; clear: both; } #inner-banner object, #inner-banner embed { display: block; max-width: 100%; height: auto; } /* контентные колонки и промо-боксы: absolute+fixed-size → поток, авто-размер */ #left-page, [id^="bnavlp"], #boxtl, #boxtc, #boxtr, #boxbc, #boxbl, #boxbr, [id^="boxctr"], #right-page { position: static !important; top: auto !important; left: auto !important; width: auto !important; height: auto !important; margin: 0 !important; box-sizing: border-box; } /* контентные колонки — на всю ширину wrapper'а */ #left-page, [id^="bnavlp"] { max-width: 100%; margin: 0 0 12px !important; clear: both; } /* float-контент внутри промо-боксов не должен «вытекать» наружу */ #boxtl, #boxtc, #boxtr, #boxbc, #boxbl, #boxbr, [id^="boxctr"] { overflow: auto; } /* шапки секций (learn.jpg / getinvolved.jpg) — блок, не float */ #boxtl .tlpad, #boxtr .trpad, #boxtr #trpad, #boxbl #blpad, #boxbl #blpadr2 { float: none !important; display: block; width: 100%; padding: 0; } #boxtl .tlpad img, #boxtr .trpad img, #boxtr #trpad img, #boxbl #blpad img { display: block; max-width: 100%; height: auto; } /* пункты списков внутри колонок — тоже без float, иначе текст уезжает */ #boxtl .tlnews, #boxbl .blnews, #boxbl .blnewsr2 { float: none !important; width: auto; display: block; clear: both; overflow: auto; } #boxtc #tcpadsearch, #boxtc .tcpadmid, #boxtc .form-item, #boxtc .form-text, #boxtc .form-submit { float: none !important; } #boxtc #tcpadsearch { padding: 10px; text-align: center; } #boxtc .form-text { display: inline-block; width: 70%; max-width: 180px; } #boxtc .form-submit { display: inline-block; vertical-align: middle; } /* ============================================================================ Homepage grid — восстановить 3-колоночную раскладку в нормальном потоке HTML-порядок: banner → tl → tc → bc → tr → bl → br Оригинал: [tl | tc | tr] [tl | bc | tr] [bl | br] ========================================================================== */ #wrapper:has(> #boxtl) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "top top top" "nav nav nav" "banner banner banner" "tl tc tr" "tl bc tr" "bl bl br"; column-gap: 0; row-gap: 0; align-items: stretch; } #wrapper:has(> #boxtl) > #top-image { grid-area: top; width: 100%; } #wrapper:has(> #boxtl) > #top-nav { grid-area: nav; } #wrapper:has(> #boxtl) > #inner-banner { grid-area: banner; width: 100% !important; } #wrapper:has(> #boxtl) > #boxtl { grid-area: tl; } #wrapper:has(> #boxtl) > #boxtc { grid-area: tc; } #wrapper:has(> #boxtl) > #boxbc { grid-area: bc; } #wrapper:has(> #boxtl) > #boxtr { grid-area: tr; } #wrapper:has(> #boxtl) > #boxbl { grid-area: bl; } #wrapper:has(> #boxtl) > #boxbr { grid-area: br; } /* showLinks / last posts / footer — на всю ширину под сеткой */ #wrapper:has(> #boxtl) > section, #wrapper:has(> #boxtl) > div:not([id]), #wrapper:has(> #boxtl) > footer { grid-column: 1 / -1; } #wrapper:has(> #boxtl) > #top-image img { display: block; max-width: 100%; height: auto; } #wrapper:has(> #boxtl) > #inner-banner object { width: 100% !important; max-width: 818px; } /* ============================================================================ Общий footer (бывшие #bnavtpl*/#bottom-nav →