css - How to move a single block to the left? -

css - How to move a single block to the left? -

on drupal 7 website, i'm having 3 blocks in environment, called 'topbar links', next layout: http://jsfiddle.net/jeroen94/54l57/1/.

mind first , 3rd block nice menus. don't provide code, because of isn't relevant, layout should maintained. 3 blocks displayed @ right, now, i'd display 'nice menu 1' left , maintain 'my profile' , 'nice menu 2' right. thought

.menu-1 { left: 0; }

would trick, doesn't work, because couldn't overwrite right. maybe right: ...px trick 'nice menu 1', don't find nice solution, because width 'topbar links' can still alter in future, causing layout break.

how can solve this?

the problem positioning parent div right , not setting width - children of div can positioned within constants of parent div

you can utilize :first-child selector select first , eliminate need separate class.

try

<div class="topbar-links"> <div id="block-1">some content</div> <div id="block-2">some content</div> <div id="block-3">some content</div> </div> .topbar-links { position: absolute; right: 0; top: 0; vertical-align: top; width: 100%; } .topbar-links div { float: right; } .topbar-links div:first-child { float: left; }

jsfiddle http://jsfiddle.net/jc9ac/

another solution stop switching around of elements mentioned jsfiddle.net/jc9ac/2

css drupal