css-position

问题 i'm new with html5 and css3. I released my first website last month and now i found out that it's not working well in the new chrome version (22): All the fixed elements are no longer fixed... The navigation bar on the top of the screen for example. it was fine only a week ago and i have no idea why now it's not. This is the website: www.biofilter.co.il As far as i can tell, it's still working fine in Firefox and IE. Does anyone has an idea what's going on and what could be the reason? 回答1:

问题 I understand that any element with position: absolute will be positioned relative to the nearest ancestor with a positional attribute such as absolute or relative . This is mentioned in various answers for example here. Also on the w3schools site here... An element with position: absolute; is positioned relative to the nearest positioned ancestor (instead of positioned relative to the viewport, like fixed). However, inserting a static element appears to disrupt this rule and shifts the

问题 I'm creating a prototype of a CSS/XHTML tables-based calendar that eventually will be generated with PHP for the Simple Updates content management system. I've run into a problem with using absolute positioning to create a popup that would show all the events in a day when there are more than will fit in a cell. The problem can be seen here: http://sutest.bravehost.com/ As you can see, the popup pops under the multi-day event and date in both IE7 and IE6. Putting a z-index on the popup fixed

问题 I'm creating a prototype of a CSS/XHTML tables-based calendar that eventually will be generated with PHP for the Simple Updates content management system. I've run into a problem with using absolute positioning to create a popup that would show all the events in a day when there are more than will fit in a cell. The problem can be seen here: http://sutest.bravehost.com/ As you can see, the popup pops under the multi-day event and date in both IE7 and IE6. Putting a z-index on the popup fixed

问题 I fear I quite don't know how to explain it as well as I can show it. So I've set up this Fiddle. As you can see, the nav menu is not where it should be. It should be set exactly at the bottom border of the head element and to the left border. I.e. bottom: 0 and left: 0 . However, I'm setting a rotation of -90degs and it is obvious that the absolute positioning on the nav element is happening before the rotation or perhaps rather on the original element as if the rotation didn't exist. I've

问题 Few months ago i read this Swing tutorial http://zetcode.com/tutorials/javaswingtutorial/resizablecomponent/ for understanding how implementing resizable components inside Swing. The tutorial tells about using a null LayoutManager in order to have the possibility of absolute positioning child components. In a discussion relative to another subject @Andrew Thompson pointed out that using null layout is a bad idea. This article http://download.oracle.com/javase/tutorial/uiswing/layout/none.html

问题 I would like to style my menu bar Like THIS. It's fixed to the top of the site when you scroll down and it isn't fixed where it is when the page is loaded. How can it be done with CSS? 回答1: What you're after is a 'sticky navbar/menu'. The simplest way would be to add the below CSS to your menu/navbar position:fixed; top:0px; That said, for an effect closer to the one you've posted, you'll probably want to look at using some jQuery, e.g.: $(window).bind('scroll', function() { if ($(window)

问题 I would like to style my menu bar Like THIS. It's fixed to the top of the site when you scroll down and it isn't fixed where it is when the page is loaded. How can it be done with CSS? 回答1: What you're after is a 'sticky navbar/menu'. The simplest way would be to add the below CSS to your menu/navbar position:fixed; top:0px; That said, for an effect closer to the one you've posted, you'll probably want to look at using some jQuery, e.g.: $(window).bind('scroll', function() { if ($(window)

问题 I need to realize this menu with its submenu: I set the main menu to be a ul / li with li float: left; display: block; and inside them there is an a element with properties display: block; and some padding. Every li has position: relative . Inside every li there is a .main_menu_submenu div, with position: absolute . Inside, it has another ul / li where every li has again properties display: block; float: left . The problem is that the width of .main_menu_submenu adapts depending on the width

问题 I have a strange problem today, in Chrome, when I focus on an element that is absolutely positioned out of its overflow hidden container, it gets visible in Chrome browser (Mac). I've made a fiddle to illustrate the problem : http://jsfiddle.net/GHgtc/ Html <div id="container"> <a id="inner-button" href="#">You can see me !</a> </div> Css #container{ display: block; background: blue; width: 200px; height: 30px; position: relative; overflow: hidden; } #inner-button{ display: block; background: