Здравствуйте у меня вот такая проблема.
Вот дизайн. http://profiwm.com/files/mail/PROFIWM_COM_8144_1086935_strani4ka.png
А если зайти с мобильки то: http://profiwm.com/files/mail/PROFIWM_COM_4063_1088024_Screenshot_2015-06-01-11-49-36.png
как нормально сделать?
Делай адаптивный дизайн для разных размеров экрана.
Либо для мобильных устройств делай отдельный вариант, определяя, с какого типа (wap/web) устройства находится посетитель сайта.
Как сделать, тут ток нижняя часть вот такой.
media query привет
на http://beloweb.ru есть обучение основам адаптивного дизайна
Как вариант можно использовать разные стили:
<?
< link href="/style.css" rel="stylesheet" media="only screen and (max-width:480px)" />
?>
Или в самом стиле каждый див прописывать под разные размеры экрана, делая тем самым дизайн адаптивным:
<?
.block {
width: 30%;
}
Удалён all and (max-width: 480px) {
.block {
width: auto;
}
}
?>
Добавлено 02.06.15 в 13:02:19:
Но, как ранее писали тут, смотри на БелоВеб.
Я сам так кручусь и переписываю разные шаблоны под свои проекты.
Я хочу нормально сделать что бы иконки внизу не слетели так.
Дивы та иконок
#onasl {
float: left;
position: relative;
top: 10px;
margin-left: 20px;
}
#onasc {
position: absolute;
top: 10px;
margin-left: 400px;
}
#onasr {
float: left;
position: relative;
top: 10px;
margin-left: 35px;
margin-right: 0px;
}
#vyezd {
float: left;
position: relative;
top: 10px;
margin-left: 200px;
?>
}
#krat {
float: left;
position: relative;
top: 10px;
margin-left: 50px;
}
display: inline block
Добавлено 03.06.15 в 11:32:49:
Папробуй заменить вместо позицый
Добавлено 03.06.15 в 11:36:09:
ul li .content {
background: #E76D13;
width: 98px;
height: 98px;
display: inline-block;
border: 1px solid #000;
//display : inline;
//zoom : 1;
}