css-position

问题 Looking for the View Button to be locked to the bottom, using position:absolute; would cause the price to merge into the View Button. https://jsfiddle.net/kieranbs96/pj8emf0a/ a.view-button { float: left; padding: 7px 30px; background: #e35f00; color: #ffffff; text-transform: uppercase; } .offer, .recommendation { float: left; flex: 1 0 32%; margin: 0 0.3%; width: 32%; position: relative; } Any questions please ask. 回答1: You need to make your div.offer box a (nested) flex container in column

问题 I have this problem with my CSS animation. I have an element position absolute centered in the middle of the page and when I put the animation on, it moves to the right and when the animation is finished it moves back to the middle of the page. Here's the code: @keyframes motto from opacity: 0 transform: translate3d(0, -100%, 0) to opacity: 1 transform: none #home .motto position: absolute top: 50% left: 50% margin-right: -50% transform: translate(-50%, -50%) animation-name: motto animation

问题 I have a div with a scrollbar. Within it, I have various elements, one of which is an link with display:block and position:relative; Inside of this link are an img with default positioning, and an h3 tag which is supposed to appear over the top of that img, with position:absolute. When I scroll the DIV, other things scroll properly, but these elements and their contents stay fixed. Any ideas on how to solve this bug? Here's a fiddle, and the approx. code is below: http://jsfiddle.net/Z987x/

问题 Updated this as I found it is not necessarily nested IFRAMEs, but merely the presence of Flash within the IFRAMEd document that will break position:fixed (also within the IFRAME). This is unreal. On Safari (Mac): Flash ...within an IFRAME (e.g., a modal window, Fancybox, etc.) ...will "break" any "position:fixed" elements also within that IFRAME. Here's a perfect example: http://jsfiddle.net/6GP2A/ Note that we have: An IFRAME that contains Flash (YouTube video). within another IFRAMEd doc

问题 I tried to put a child div that will come under its parent and over the other elements. .box1{ background-color: blue; width: 500px; height: 100px; position: relative; z-index: 3; } .box2{ position: absolute; background-color: red; width: 200px; height: 100px; left: 30%; top: 20px; z-index: 2; } .box3{ background-color: yellow; width: 500px; height: 100px; z-index: 1; } <div class="box1"> <div class="box2"></div> </div> <div class="box3"></div> I want to position the red rectangle to be under

问题 I have a webpage in which there is scrollable content. This content is wrapped inside #content, which is centered on the page. Now I want a navigation bar to appear 50px left to the content. This bar should have a fixed position (shouldn't scroll). This is what I have tried so far: #nav { position: fixed; top: 50%; margin-top:-200px; left:15%; background: #FFF; width: 100px; height:400px; border-radius: 50px; } #content { position: relative; width: 800px; margin: 0px auto; padding-top: 100px;

问题 I imagine there is a simple solution, but it eludes me. If you look at this page you will see that only the header has a grey background. The grey background is set by the #container DIV which I would like to stretch down the entire height of the page: #container { padding: 0; margin: 0; background-color: #292929; width: 1200px; margin: 0 auto; } At the moment it is only stretching over the header section of the page, and the content below is not contained within it. I imagine that is because

问题 Just checking to see whether there's a way to do this in CSS before I get my Javascript on! In the example, the #fixed div gets filled with content dynamically - so we never know how big the content in that div will be. The beginning of the #absolute div must always be rendered underneath the #fixed div. The #absolute div also gets filled with lengthy content dynamically, so the user must be able to scroll the content in that div, no matter how big it gets. Without knowing the size of the

问题 I had a discussion with someone about absolute positioning. He claims that the best practice to secure that everything looks all the same across most browsers and that it's the easiest way to maintain the looks and feel that you intended for a website. I disagreed with his opinion, that absolute positioning would be the remedy and an overall best approach to laying out a webpage. In my case, I've been more keen on using the approach of margin/width/careful floating adjustments, and sometimes

问题 so guys, if u test the code below, u can see that everything is alright, except if u size down the window, so the flash menu ( red div ) is going out of the page to the right. well if the window is smaller then 900px, there is a HORIZONTAL scrollpane, so far so good, but it just scrolls the content of the page! I want the upper part also to scroll, but only horizontal, cuz I want them to be fixed (stay on top of the site always)... any suggestions? I've tried so many things from google, but