Як я магу выкарыстоўваць CSS (адзіны элемент, да якога я маю доступ), каб наладзіць фіксаваны HTML на вэб-сайце, які выкарыстоўваецца для перамяшчэння пэўнага класа на больш высокую пазіцыю на старонцы?


адказ 1:

Як ужо згадвалі іншыя, ёсць некалькі спосабаў зрабіць гэта, нават калі гэтыя спосабы неакуратныя.

Напрыклад, калі ў вас ёсць фіксаваная вышыня для гэтых элементаў, вы можаце выкарыстоўваць адмоўныя і станоўчыя запасы для перамяшчэння змесціва. Часам гэта робіцца для бакавых панэляў, якія прыходзяць пасля зместу па меркаваннях SEO, але ўсё яшчэ трэба размяшчаць перад гэтым змесцівам. Пазіцыянаванне можа прымусіць вас там, дзе вам трэба быць, але з велізарнымі галаўнымі болямі дакладна.

Маё рэкамендаванае рашэнне выкарыстоўвае CSS3

Дысплей: Flex

асаблівасць і

Ордэн

уласнасць.

У мяне ўсё працуе над CSSDeck. Код вы можаце паглядзець тут:

Змена парадку змесціва з дапамогай CSS3

Дзеля таго, каб мець яго ў Quora, ваш HTML можа выглядаць так:

  1. Па-першае Другі Трэцяе Чацвёртая

Ваш CSS будзе выглядаць так:

  1. # прыклад {display: -webkit-flex; / * Safari * / -webkit-flex-кірунак: слупок; / * Safari 6.1+ * / дысплей: flex; flex-direction: column;} div> div {padding: 15px; запас: 5px; мяжа: 1px пункцір;} # block-1 {парадак: 1; -webkit-парадак: 1;} # блок-2 {парадак: 3; -webkit-заказ: 3; } # блок-3 {парадак: 2; -webkit-заказ: 2; } # блок-4 {парадак: 4; -webkit-заказ: 4; }

Улічыце, што гэтая функцыя можа не падтрымлівацца ва ўсіх браўзэрах, якія вы хацелі б падтрымліваць. Напрыклад, IE 10, хутчэй за ўсё, дасць вам праблемы.

W3Schools мае годную дакументацыю пра гэтую функцыю тут:

Уласцівасць парадку CSS

EDIT: Гледзячы на ​​наяўную ў вас спасылку JsFiddle, няма ніякага спосабу, каб вы пазбавіліся ад гэтага толькі з дапамогай CSS. З-за дрэннай структуры сайта, як гэта, але горш:

  1. Па-першае Другі Трэцяе Чацвёртая

Без элементаў фіксаванай вышыні і працы па паляванні / пазіцыянаванні, ваш адзіны варыянт - рэдагаваць тэму альбо выкарыстоўваць JavaScript для перамяшчэння элементаў.


адказ 2:

Паглядзеўшы на сайт, я не магу прыдумаць добры спосаб зрабіць гэта. Паміж элементамі ёсць занадта шмат элементаў, каб палегчыць пазіцыянаванне.

Ці маеце вы доступ да адміністрацыйнай панэлі WordPress? Ці ёсць у яе варыянты тэмы? На старонках спісаў ёсць розныя макеты, якія вы можаце выбраць?

у адпаведнасці з тэматычным сайтам,

Плімут

гэта выглядае вельмі надзейна, але прыклады, якія яны паказваюць, сапраўды маюць агульную кампазіцыю. Гэта можа быць звязана з тым, як яны імпартуюць кантэнт.

У ідэальным свеце вы можаце зрабіць дзіцячую тэму і адрэдагаваць файл single.php, але паколькі вы не можаце, я прагледзеў тэматычную дакументацыю, каб убачыць, ці прадугледжаны яны іншыя варыянты разметкі.

Поспехаў.


адказ 3:

Паводле традыцыі, няма належнага спосабу зрабіць гэта. Як адзначалася ў Ітэры, вы можаце дадаць адмоўныя запасы да пэўных элементаў, каб змяніць іх перастаноўку, але гэта няправільная практыка.

Зірніце на флекс-скрыню: http://css-tricks.com/snippets/css/a-guide-to-flexbox. Выкарыстоўваючы гэта, вы маглі б дасягнуць таго, што хочаце больш правільна. Але ўлічыце, што флексбокс усё яшчэ мае праблемы з падтрымкай браўзэра і патрабуе не толькі пастаўшчыкоў, але і розных імёнаў.


адказ 4:

туды ты ідзеш.

  1. .hentry {пазіцыя: адносная; уверсе: -300px;}. абгортка {перапаўненне: бачны;} / * # main_content {перапаўненне: бачны;} * /. уласцівасць-дэталі-інфармацыя {top: 150px; становішча: адносна;}., размяшчэнне {// дысплей: няма; // ці вы можаце выправіць яго ўнізе старонкі}

Раздвоеная:

http://jsfiddle.net/rohithzr/zkkjdsfn/2/

Рэдагаваць: выпраўленая .locationfixed адлегласць, абноўленая URL