Resizing problem
След като направих задачата "Fakebook Register Form" забелязах че страницата не се държи добре при зуумване, в JS Fiddle си личи : http://jsfiddle.net/Rz6Zg/
Моля за съвет :)
Във форума е въведено ограничение, което позволява на потребителите единствено да разглеждат публикуваните въпроси.
До колкото виждам кода, основния проблем е "position: relative;", който води до това разминаване при увеличаване на страницата. Опитай с "display: inline-block;" и след това позиционирай с margin и padding. Другото което видях е, че не си затворил навсякъде таговете, то си работи, но е некоректно. Също така забелязах, че пишеш "</br>", което също е грешно, правилният начин е "<br />". Също така "#right, #right fieldset" селектира първо div-a и му задава стилове, след това селектира fieldset-a и му прилага същите стилове, което е излишно. Малко го пооправих ето тук. Дано съм ти помогнал, ако има нещо друго питай :)
Благодаря :) Ще разцъкам повече display опцията, да видя какво може да прави.
Попринцип правилно ли е да се донаглася толкова много с отрицателни стойности за падинг и марджин, или това просто показва че не използвам дисплей и флоут опциите правилно?
Поприцнип някой път се налага да се ползват отрицателни стойности, но в повечето случеи може да се постигне позиционирането без отрицателни стойности, с правилно използване на float и display. Отрицателен margin може да се ползва, за да се скрие част от елемент или целия ако трябва.
http://jsfiddle.net/PYovchevski/49PsL/
Оправих ти подредбите но си оправи размерите. виж си ID Left и Right там са прекалено големи. Имаше и грешно писани break тагове като например </br> а се пишат <br />.
Благодаря, преатели! Доста сте полезни.
Днес прочетох още малко за display:inline-block и ми се стори доста удобно. И направих следващата задача в този стил.
http://jsfiddle.net/Krafferious/x4pAt/
Само дето това пренасяне на 2 елемента, после един после пак 2 може би трябва да се оправи...Какво мислите?
Проблема с пренасянето ти идва от "<br />" след третия item, ако го махнеш и направиш фиксирана дължина на container, така че да се побират 3 елемента на един ред всичко се оправя. За заглавията можеш да си направиш един елемент, който да съдържа още три и там да си ги позиционираш.
Приятел, виждам че си ползвал id за стилизиране при новите продукти и цените. Направи ги да бъдат с class защото тези id-та ги ползваш на повече от едно място. ID трябва да бъде уникално за да ти бъде валидиран кода. Просто промени #new #new span и #price на .new .new span и .price ;)