Форум Flasher.ru - содержимое блока шире самого блока

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)

- HTML/DHTML/CSS/JS/VB (http://www.flasher.ru/forum/forumdisplay.php?f=66)

- - содержимое блока шире самого блока (http://www.flasher.ru/forum/showthread.php?t=94465)

содержимое блока шире самого блока

как нужно сделать, чтобы блок, содержащий горизонтальное меню, полностью его охватывал, когда это меню не уменьшается в окне браузера по ширине? (применительно к примеру - чтобы вылезающая за пределы окна вправо часть меню была на сером фоне)

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Untitled Document</title>

</head>

<style type="text/css">

* {

    padding: 0;

    margin: 0;

}

#header {

    position: absolute;

    width: 100%;

    top: 0;

    background-color: yellow;

    height: 40px;

}



#header #menu{

    background-color: gray;

    white-space: nowrap;

    text-align: right;

    margin-left: 200px;

}



#header #menu div {

    display: inline;

    border: 1px solid red;

}

</style>







<body>



<div id="header">

    <div id="menu">

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

        <div>menu item</div>

    </div>

</div>



</body>

</html>

Убери ширину в 100%, просто вообще не указывай её. Сталкивался с такой фенечкой когда-то.

оперативненько... щас попробую

Я не проверял, может и не помочь.

ээ, ты чего
тогда у меня футер будет не на всю ширину в широком окне

т.е. хедер

Жди тогда спецов. У меня на слово «вылезает» сразу реакция «убрать 100%». В данном случае 100% тоже виноваты в таком поведении.

тупой способ, но работает:

Код:

<nobr>д л и н н о е м е н ю</nobr>

Можно попробовать такой параметр как min-width
Возможно, iE потребуется отдельно указать _width.

Но я так, методом тыка. Ждём специалиста.

Таблицы... Ну или как-то вот так:

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Untitled Document</title>

</head>

<style>

* 

{

padding : 0px;

margin  : 0px;

}



#header 

{

    background-color : yellow;

    position   : absolute;

    top        : 0px;

    left       : 0px;

    right      : 0px;

    height     : 40px;

    text-align : right;

}



#header #menu

{

    background-color : gray;

    white-space      : nowrap;

    margin-left : 200px;

}



#header #menu div

{

    display : inline;

}



#container

{

    background-color : gray;

    display : inline;

}

</style>



<body>

<div id="header">

    <div id="menu">

        <div id="container">

        <div>menu item1</div>

        <div>menu item2</div>

        <div>menu item3</div>

        <div>menu item4</div>

        <div>menu item5</div>

        <div>menu item6</div>

        <div>menu item7</div>

        <div>menu item8</div>

        <div>menu item9</div>

        <div>menu item0</div>

        </div>

    </div>

</div>

</body>

</html>

нарисуй 2 картинки -- чо надо при широком окне и чо при узком.
а то я не понял.-

1.сделай html как в первом посте
2.открой его в файрфоксе или опере
3.сожми окно по горизонтали, чтобы появилась полоса прокрутки
4.проверни его вправо
5.смотри: серый фон кончается раньше, чем пункты меню

надо, чтобы не кончался