CSS: Помощь с позицией относительной / абсолютной

Question

У меня есть строка главного меню в верхней части моей страницы. Теперь мой #LinkToMenu не может изменить размер и тому подобное, даже если есть position: relative. Но он будет работать нормально, если я установлю определенную ширину в стиле #mainmenu, чего я не хочу. Я даже попробовал width: auto, но безуспешно.

<div id="mainmenu" style="position: relative;">

<div id="LinkToMenu" style="position: absolute; right: 130px; top: 10px;">
  <a href="home.php">Home</a>
</div>

<img src="images/mainmenu_logo3.png" style="position: absolute; top: 2px; left: 210px; ">

В чем проблема? Как я могу решить это?

Изображение с почти такими же настройками отлично работает при изменении размера и т. Д., Но не с помощью ссылок?

Answer 1

#mainmenu фактически не имеет содержимого - это два дочерних элемента position:absolute, поэтому они удаляются из обычного потока.Таким образом, элемент DIV является блоком, поэтому должен расширяться до полной ширины контейнера, хотя не будет иметь никакой высоты.

Answer 2

Я думаю, что #linkToMenu должна быть назначена ширина.

Answer 3

position: относительный сообщает движку css, что этот div является ссылкой на внутренние div.

position: absolute говорит о том, что этот div является абсолютным позицией для внешнего div, который имеет относительную позицию или если ему не назначено окно браузера.

если только вы не зададите ширину и высоту относительного div, вы фактически не можете правильно найти абсолютную позицию div.

Answer 4

не совсем уверен, что понимаю ваш вопрос, но я думаю, что вы должны сделать следующее:

#LinkToMenu{ position: absolute; right: 130px; top: 10px; float:right"}
#mainmenu{float:right; width:100%}

Это должно сработать.

Answer 5

Я не знаю, правильно ли я понимаю вашу проблему, но я делаю что-то подобное и делаю это так (в таблице стилей): .header {position :lative;верх: 0;слева: 0;обивка: 6px 6px 5px 5px;высота: 85 пикселей;}

Кажется, я помню, что следующий абсолют не работал без верха и левого угла, так что позиция что-то делает.

Надеюсь, это поможет