Is it possible to move the top links in user menu from the right hand column, to the left column purely with CSS?

My theme has it by default in the right column, but the design needs it to be in the left hand column for symetry. The basket and search bar need to remain in the top right section. Only the top links moving to the left column.

My CSS knowledge is pretty minimal, I've tried the below:

    .header-regular .right-column .user-menu .top-links, 
    .header-regular .right-column .user-menu .top-links ul {
        position: relative;

But it only moves the top links around in the right column, tried using float: left; too, but no movement.

Screenshot of what I mean:


Any help would be appreciated.


You wont be able to do this with just css. You will need to change the html markup. The Items are in a block <div class="hp-block right-column grid12-4" ></div> and therefore you can't move them without making them position: absolute which is a bad idea! Especially for a responsive site.

  • Hi Rob, cheers for the feedback. I knew the block to edit and aware it can be done with html in the pages, but really wanted to do just with CSS somehow. Mainly so code doesn't get overwritten in next update. I suppose I can create sub theme and do that way, but was really looking for a quick way of doing with just CSS or the like. Cheers. – MagentoMac Oct 21 '15 at 12:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.