ilvl

Разобрался! Как удалить тему??

Добрый вечер помогите пожалуйста, имеем следущую конструкцию <div style="overflow: hidden;"> <div style="width: 100%"> <div style="float: left;padding:5px"><img style="max-width:100%; border:1px solid white" src="http://unispot.pro/image/catalog/test.jpg"></div><div style="float: left;padding:5px"><img style="max-width:100%; border:1px solid white" src="http://unispot.pro/image/catalog/test3.jpg"></div> <div style="float: left;padding:5px"><img style="max-width:100%; border:1px solid white" src="http://unispot.pro/image/catalog/test3.jpg"></div><div style="float: left;padding:5px"><img style="max-width:100%; border:1px solid white" src="http://unispot.pro/image/catalog/test.jpg"></div>Не могу понять как выровнять её всю по центру страницы, куда не прописываю align="center"он почему-то не работает. Может дело во Float left?? Спасибо!

Спасибо, всё понял удалось решить проблему и выполнить поставленную задачу, НО, как не удивительно появилась новая проблема. Вот мой код <div style="overflow: hidden;"> <div style="width: 100%"> <div style="float: left;padding:25px"><img style="max-width:100%; border:1px solid white" src="http://unispot.pro/image/catalog/smartbook600v123.jpg"></div> <div style="float: left;width:420px ;max-width:100%;padding:30px"><h1>ЧТО ТАКОЕ СМАРТБУК?</h1><p>Smartbook - это универсальные пк-трансформеры, сочетающие в себе компакность плашетных пк и функциональные преимущества полноценных ноутбуков. Такие девайсы идеально подойдут для любых задач и заменят оба устройства ПК и планшетный компьютер, объединив их в себе. Смартбуки построены на самых современных чипсетах, что и позволяет им обеспечивать сверхвысокую производительность при низком энергопотреблении. Ещё одним преимуществом смартбуков является возможность выбора рабочей среды: Android или Windows, а самые новые модели и вовсе предоставляют возможность переключения, при одновременном использовании обоих операционных систем на одном устройстве. UNISPOT.PRO предлагает большой выбор смартбуков для любых задач: широкий диапазон цен и форм-фактора коплектаций позволит Вам выбрать устройство, которое приятно удивит Вас и Ваших друзей.</p></div> </div></div><style type="text/css">.tablica { display: table; width: 100%; border-spacing: 10px 10px; } .yacheika { display:inline-block; padding: 10px; }</style><div align="center" "="" class="tablica"> <div class="yacheika"><div style="width:300px"> <p style="text-align: left; "><img style="border:1px solid white" src="http://unispot.pro/image/catalog/smartbooks/smartbook400(3).jpg"><br></p><figcaption style="text-align: left;">Бюджетные смартбуки для начинающих юзеров, простых повседневных задач, отдыха и работы.</figcaption></div></div> <div class="yacheika"><div style="width:300px"> <p style="text-align: left;"><img style="border:1px solid white" src="http://unispot.pro/image/catalog/smartbooks/smartbook400(1).jpg"><br></p><figcaption style="text-align: left;">Производительные смартбуки на топовых чипсетах - мощные новинки уже ждут Вас.</figcaption></div></div> <div class="yacheika"><div style="width:300px"> <p style="text-align: left;"><img style="border:1px solid white" src="http://unispot.pro/image/catalog/smartbooks/smartbook400(2).jpg"><br></p><figcaption style="text-align: left;">Проверенные решения по доступной цене: Идеальный выбор на рынке смартбуков.</figcaption></div></div></div>Задача сделать так, что б верхний блок (первое большое изображение и текст) сохранив все возложеные на них надежды , отображались по центру страницы, а не слева так как сейчас. Помогите пожалуйста, не могу разобратся, пока-что получается только отцентрировать текст, но это не то что нужно. Нужно что б центрирование текста осталось слева и вообще всё было так же как сейчас, ибо сейчас удалось добится всех поставленных задач и при этом ничего не плывет и не тянет на мобильных и даже наоборот - всё правильно перепрыгивает и ужимается, как только размера для отображения не хватает, но на контупере смотрится плохо потому-что контент слева, а хочется что б он был по-центру. Спасибо.

Добрый день, расклад такой. Вроде всё получилось, НО после того как добавил изображению отступ(margin) при отображении на мобильных снова растягивает сайт - изображение вылазит за ширину сайта справа. Тоесть получается, что max-width изображения не действует на (margin) и несмотря на то, что изображение ужимается из-за широких отступов всё сыпится. Сори, если не понятно объяснил - короче задача сделать так, что б картинка уменшаясь вместе с рамочкой и находилась по центру странички, а то сейчас всё как-то через *** вроде картинка по центру но правый margin вылазит "за сайт". спасибо

Спасибо, понял всё исправил: ошибки делал две: писал два style, а даже, когда пробовал один style, то писал style="float:left"; "max-width:100%" ))тоесть использовал отдельные кавычки для float и max-width! СПАСИБО, очень доступно и вежливо)))

Доброго времени суток, спасибо, что отозвались) вот видео, где наглядно показал в чём проблема: https://www.youtube.com/watch?v=FNeKKPls7Hc&feature=youtu.be делайте тише, ибо snagit чё-то очень громко записал мой голос

Добрый вечер, для начала краткий экскурс. Делаю сайты много лет, в основном работал с WYSIWYG софтом и готовыми шаблонами для разных CMS`ов и в верстку никогда особо не лез, работаю уже больше 10 лет и всегда справлялся с любыми задачами, однако время идёт и что бы не деградировать нужно наоборот, развиватся=))) на смену WYSIWYG пришел http://scratchpad.io/на котором я принялся практиковатся в выполнении необходимых мне задач. Короче задача следущая, картиночка с max-width 100% справа от которой располагался бы текст тоже с max-width 100%, с условием, что в случае если экранчик маханький при маханький как на мобильном - текст перепрыгивает и размещается под картиночкой, которая в свою очередь тоже ужимается, а если экран большой при большой как на контупере - то все красиво: слева картиночка, справа текст. Вот с такой эллементарной задачей я не могу разобратся второй день: пытался делать по разному и через float и через вот такую конструкцию <style type="text/css">.tablica { display: table; width: 100%; border-spacing: 10px 10px; } .yacheika { display:inline-block; padding: 10px;}</style><div class="tablica"> <div class="yacheika"><div <p=""><img style="max-width:100%" src="http://unispot.pro/image/catalog/smartbook600v12.jpg"><br><p></p></div></div> <div class="yacheika"><h1 style="width:400">ЧТО ТАКОЕ СМАРТБУК? </h1><p style="width:400">loremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablablaloremipsumblablabla </p></div></div> но столкнулся с тем, что атрибуты стиля(извините, если что не так называю), конфликтят друг с другом, тоесть: если выполняется автоужим картиночки по размеру экрана, то не работает обтекание, а текст располагается или под картинкой или неправильно в строчку после неё, а если работает обтекаемость текстом, то перестаёт работать max-width и картиночка тянет сайт на мобильных. не прошу делать работу за меня, ибо так я ничему не научусь)) прошу сказать правильно ли я понял, что стили конфликтят друг с другом, или нет? И есть ли возможность, всё же сделать, то, что необходимо - понимаю, что есть, но не понимаю логику процесса?!ещё раз для ясности задача: в одном ряду справа картиночка, слева текст всё это в одном ряду, при ужимании размера экрана, текст прыгает под картиночку и оба эллемента(текст и картиночка ужимаются по правилу style="max-width: 100%; спасибо за внимание!