Jump to content

оцените верстку html5 css3


pitbuli
 Share

Recommended Posts

причина вот в чем  была перед javaScript  document.createElement  по невнимательности  буква s была я удалил и уже применились стили  но есть кое какие 

не достатки слаидер что-та  исчез.  Мелкие недостатки лучше будет если условными коминтариями буду исправлять .  кук вы думаете 

Link to comment
Share on other sites

причина вот в чем  была перед javaScript  document.createElement  по невнимательности  буква s была я удалил и уже применились стили  но есть кое какие 

не достатки слаидер что-та  исчез.  Мелкие недостатки лучше будет если условными коминтариями буду исправлять .  кук вы думаете 

 

<!DOCTYPE html><!--[if lt IE 7]>      <html class="no-js ie6 oldie"> <![endif]--><!--[if IE 7]>         <html class="no-js ie7 oldie"> <![endif]--><!--[if IE 8]>         <html class="no-js ie8 oldie"> <![endif]--><!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->

Используйте такую штуку. Если в старых ие что криво отображается, в css под нужным блоком создаете еще одно правило, но уже перед ним ставите класс  .ie7 (6/8) или .oldie (если проблема во всех версиях) и правите стили, они применяться только к той версии браузера, которую вы укажите.

Link to comment
Share on other sites

http://prntscr.com/25ylrk бессмысленно писать эти 2 свойства вместе либо одно, либо другое. с навигацией вы конечно жутко намудрили....

мое предложение

хтмл

<nav class="nav">  <ul>     <li><a class="rentals" href="#">Аренда</a></li>     <li><a class="service" href="#">сервис</a></li>     <li><a class="spare-parts" href="#">запчасти</a></li>     <li><a class="finance" href="#">калькулятор</a></li>  </ul></nav>

css

.nav{	margin:40px 0 0;	font-size:15px;	font-weight:bold;	text-transform:uppercase;}.nav ul{	display:table;	width:100%;	table-layout:fixed;}.nav li{	background: #8D1B1B; /* градиент сами пропишите */	display:table-cell;	vertical-align:middle;	text-align:center;	padding:10px 10px 9px;	border-left:3px solid #fff;}.nav li:first-child{border:none;}.nav li a{	color:#fff;	display:inline-block;	vertical-align:top;	text-decoration:none;	padding:12px 0 11px 45px;        max-width:100%;        word-wrap:break-word;        -webkit-box-sizing:border-box;        -moz-box-sizing:border-box;        box-sizing:border-box;	background:url(../images/rentals.png) 0 50% no-repeat;}.nav li a:hover{text-decoration:underline;} /* думаю черный цвет текста тут не к месту, либо иконка тоже должна цвет менять*/.nav li .service{background-image:url(../images/service.png);}.nav li .spare-parts{background-image:url(../images/spare_parts.png);}.nav li .finance{background-image:url(../images/finance.png);}

в результате получите навигацию которая тянется на 100% экрана, кнопки одинаковой ширины. упрощенна структура html и css. теперь правильная кликабелья область навигации (хотя я бы сделал что бы весь красный квадрат был ссылкой). навигация не валиться при добавлении текста, тянется и выравниваются по высоте. было http://prntscr.com/25yuvh стало http://prntscr.com/25yv43 .  работает ие8+. если надо ие7 то тоже можно разрулить

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By pitbuli
      добрый день ! оцените верстку, по критикуйте, что не так, как должно быть
       
      http://cyberverstka.hol.es/
    • By Andrew_007
      Доброго времени суток!
       
      Я начинающий верстальщик, это одна из моих первых работ.
      Оцените пожалуйста мою верстку.
      Интересно узнать:
      1. Что сделано неправильно?
      2. Что можно было сделать лучше, проще?
      3. Оцените качество верстки по шкале 1-10 (1-наихудшее, 10-наилучшее).
       
      Ваши советы и критика очень важны для меня, заранее всем спасибо.
      Кстати, всех с прошедшими праздниками! 
       
      Вот собственно сама верстка: http://mywork1.andrew-layout.tk/
    • By xzarxzes
      верстка: http://themfast.herokuapp.com/
      макет: http://themfast.herokuapp.com/ThemFast.png
    • By cypler
      Оцените,пожалуйста, качество верстки и семантику http://orangefilm.gixx.ru/
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy