Верстка на div'ax, смещение оных

dotslide · May 21, 2014

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />            <title>Панель администратора</title><link rel="stylesheet" type="text/css" href="style.css" /></head><body>  <div id="container">                        <div id="header">Ш</div>                        <div id="navigation">                          <a href="#" class="knopka" tabindex="0">кнопка</a>                          <a href="#" class="knopka" tabindex="0">кнопка</a></div>                        <div id="menu">М</div>                        <div id="content">К                        </div>                        <div id="clear">                        </div>                        <div id="footer">П                        </div>            </div></body></html>

Есть код, так же style.css:

body {      background: #f3f2f3;      color: #000000;      font-family: Trebuchet MS, Arial, Times New Roman;      font-size: 12px;} #container {      background: #FFFFFF;      margin: 30px auto;      width: 900px;      height: 1000px;}#header {      background: #838283;      height: 200px;      width: 900px;} #navigation {      background: #a2a2a2;      width: 900px;      height: 20px;}#menu {      background: #333333;      float: left;      width: 200px;      height: 600px;} #content {      background: #d2d0d2;      float: right;      width: 700px;      height: 600px;} #clear {      clear:both;} #footer {      background: #838283;      height: 180px;      width: 900px;}a.knopka {  color: #fff;   text-decoration: none;  user-select: none;  background: rgb(212,75,56);   position: relative;  float:left;  border: solid;  border-width: 1px 1px 1px 1px;  padding: .2em 1.5em;   outline: none; /* убирать контур в Mozilla */} a.knopka:hover { background: rgb(232,95,76); } a.knopka:active { background: rgb(152,15,0); }

Суть в том, что если делаю border у кнопок, то все сдвигается ) Как мне припилить в этот менюбар кнопки, чтобы div не смещались, задавать margin, или как?)

npofopr · May 21, 2014

Наверно где то использовать clearfix.

Выкладывайте код в песочницу, а не сюда.

jsfiddle.net к примеру

dotslide · May 21, 2014

Извиняюсь, не знал про песочницы.

http://jsfiddle.net/2hz9d/

Наверно где то использовать clearfix.

Не понял фразы.

afdw · May 21, 2014

http://jsfiddle.net/2hz9d/1/

PS: называть классы транслитом не хорошо.

Sign In

Верстка на div'ax, смещение оных

Question

dotslide

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

npofopr

Link to comment

Share on other sites

dotslide

Link to comment

Share on other sites

afdw

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information