Witam

Mam problem z szerokością menu - przy różnych rozdzielczościach ostatnia
pozycja menu w konkretnym przypadku - kontakt - "spada w dół" poniżej
całej linii

*****************************************
* * * * * * - tak powinno wyglądać
*****************************************


a tak wygląda


*********************************
* * * * *
*********************************

********
*
********

część body

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:100%;
color:#222;
min-width:1020px;
background: url(../images/pasek3.png);
background-repeat:repeat;
}
.ic, .ic a
{border:0;float:right;background:#fff;color:#f00;wid
th:50%;line-height:10px;font-size:10px;margin:-220%
0 0 0;overflow:hidden;padding:0}
.bg {width:100%; background:url(../images/bg-top.jpg) center 0 no-repeat}
.main {width:1020px;padding:0;margin:0
auto;font-size:0.875em;line-height:1.785em;backgroun
d:#fff}..........................................


część header

header {
width:100%;
position:relative;
z-index:2;
}
.row-top {
width:100%;
min-height:101px;
background:url(../images/row-top-tail.gif) left top repeat-x #f6a20e;
border-radius:9px 9px 0 0;
-moz-border-radius:9px 9px 0 0;
-webkit-border-radius:9px 9px 0 0;
position:relative;
overflow:hidden;
z-index:1;
}



całe menu



.menu {
padding:0 0 0 0;
width:100%;
margin-top:-9px;
position:relative;
z-index:2;
}
.menu li {
float:left;
position:relative;
padding-right:2px;
background:url(../images/menu-spacer.gif) right top repeat-y;
}
.menu li.last {background:none; padding:0}
.menu li a {
display:block;
font-size:20px;
font-weight:405;
line-height:2em;
padding:6px 64px 8px 65px;
color:#fff;
/* text-transform:capitalize; */
letter-spacing:-1px;
background:#444444;
}
.menu li:first-child a {
padding:6px 0 8px;
width:62px;
text-indent:-9999px;
background:url(../images/menu-home-icon.png) center center no-repeat
#2b2b2b;
border-radius:9px 0 0 9px;
-moz-border-radius:9px 0 0 9px;
-webkit-border-radius:9px 0 0 9px;
}
.menu li.last a {
padding:6px 54px 8px 52px;
border-radius:0 9px 9px 0;
-moz-border-radius:0 9px 9px 0;
-webkit-border-radius:0 9px 9px 0;
}
.menu li a.active,
.menu > li > a:hover {background-color:#968e8e}

do góry

W dniu 2014-04-22 10:45, jameno pisze:
> Witam
>
> Mam problem z szerokością menu - przy różnych rozdzielczościach ostatnia
> pozycja menu w konkretnym przypadku - kontakt - "spada w dół" poniżej
> całej linii[...]

Wrzuć kod tutaj http://jsfiddle.net/ albo gdziekolwiek, gdzie to się da
zobaczyć na żywo.

--
Cezary Tomczyk
http://www.ctomczyk.pl/

do góry

Dnia Tue, 22 Apr 2014 10:45:30 +0200, jameno napisał(a):

> Mam problem z szerokością menu - przy różnych rozdzielczościach ostatnia
> pozycja menu w konkretnym przypadku - kontakt - "spada w dół" poniżej
> całej linii

Ale jakie jest pytanie? Bo przy floatach to jest standardowe zachowanie.
Możesz albo szerokości nadawać procentowo w połączeniu z box-sizing:
border-box (o ile masz liczbę pozycji pod kontrolą) albo wrócić do starego,
dobrego display: table / table-cell.

Chyba, że lubisz życie na krawędzi, wtedy display: flex ;)

--
Borys Pogoreło
borys(#)leszno,edu,pl

do góry