positioning

I have menu items like: Row1 Row2.. RowN and I want them not to be that wide - that's why including breaks (with max-width) I have this HTML: <div> <ul> <li>Row1</li> <li>Row1 Row2 Row3</li> <li>Row1</li> <li>Row1 Row 2</li> </ul> </div> with this CSS: /* MENU */ .menudiv {padding-left:10px; border-bottom: 1px solid #d0db88;} ul.menu { list-style-type: none; min-width: 1050px; position: relative; left:10px; display: block; height: 45px; margin: 0; padding: 0; } ul.menu li { float: left; margin: 0; padding: 0; } ul.menu li a { float: left; text-decoration: none; padding: 9px 12px 0; font-weight

I have a div set to the css class float with float being: .float { display:block; position:fixed; top: 20px; left: 0px; z-index: 1999999999; } * html .float {position:absolute;} This class causes the element to stay in a fixed position on the page (the *html part is to make it work in IE). I am using javascript to shift the position of the element horizontally and vertically. I need to get the absolute position of the div relative to the browser window in javascript (how many pixels from the top and left of the browser window the div is). Right now, I am using the following: pos_left =

Could anybody write the CSS fragment to do this? <div class="container"> <span class="left">Left</span><span class="right">Right</span> </div> Here's the CSS for .container : .container { position:absolute; bottom:0; margin: 0 5px 5px 5px; } Notice the position is absolute because it is "absolute positionated" on its containing element. I've alredy tried float:left / float:right on the two nested elements but nothing happens. Set the elements to block, set a width and float them. .left{ display: block; float:left; width: 100px; } .right{ display: block; float:right; width: 100px; } Example:

Yes, I know doesn't work with position absolute, but is there a way to display elements "below" (after in code) not behind them? Example: <img src="image.jpg" style="width: 500px; height: 400px; position: absolute; top: 0;" /> <h2 style="padding: 15px" >This text is behind not below the image</h2> Is there a way of displaying the h2 below the image excepting positioning it absolutely too? Example: http://jsfiddle.net/fDGHU/1/ (yes, I have to use absolute in my case, and dynamic margined content below, and I'm lost :D) JCOC611 The only way I was able to do what you are asking is setting the top

Is it ok to use negative margins for positioning? I have a lot in my current site and feel like it's not such a stable way to position things. I usually suggest to use them too. For example I have a checkout page with three divs on top of each other <div class="A"> header </div> <div class="B"> content </div> <div class="C"> footer </div> (A, B and C), which are meant to sit on top of each other, to appear attached. I did this using: .B { margin-top: -20px; } On div B, to meet the bottom of div A. Is this good practice or shall I re-code using top and left ? If your divs have some margin

By default the colorbox appears centered both vertically and horizontally on the screen. Is there a way to change that, for example to 10% from top vertically and centered horizontally? This will override the top position, and you can do the same with left etc: #colorbox { top: 100px !important; } 10% from top would be trickier, you'd have to implement your own positioning logic in an onload callback everytime the colorbox is shown, or extend colorbox's code, but no quick way to do that. UPDATE Colorbox now has a built-in option to do this: $("a").colorbox({ top: 100, left: "50%" }) UPDATE 2

I want the height of a container element, including margins and paddings. When I hover over the element in Chrome development tool, I get the value that I'm looking for but when I use jQuery $('element').outerHeight(true) ; I get a much smaller value. The element contains a jQuery carousel (in a container with position:relative and items position: absolute ), could that have something to do with it? Thanks in advance Lasha I have experience this issue several times, and the best solution, without the use of any plugins or unruly setTimeout functions, is to use hook into the browser's onLoad