Solved

Using css to move a class to the left of its current position

Posted on 2013-06-05
4
294 Views
Last Modified: 2013-06-05
Hi

I'm trying to move a menu to the left, and I think what I am missing in my css are the proper positioning/addition of the "Class" dots ".".

Here's a shortened URL to the site:

Link to page with menu

The menu is on the upper right and is controlled by the following in the html:

<ul class menu nav-pills _topMainRowbyMenu hidden-phone">

Open in new window


Here's the css I have so far, and it is not affecting anything at all:

ul.menu nav-pills _topMainRowbyMenu hidden-phone {
margin-left: -100px;
}

Open in new window


What mods do I have to make to the above to get it to work -- that is, move the top right menu a bit to the left.

Thanks

Rowby
0
Comment
Question by:Rowby Goren
  • 3
4 Comments
 
LVL 56

Expert Comment

by:Julian Hansen
ID: 39222643
Change this on line 203 of rt_leviathan-custom.css
ul.menu.nav-pills._topMainRowbyMenu {
  margin-left: 100px;
}

Open in new window

0
 
LVL 56

Accepted Solution

by:
Julian Hansen earned 500 total points
ID: 39222658
The reason your code does not work is you left out the .'s this should also work

ul.menu nav-pills._topMainRowbyMenu.hidden-phone {
margin-left: -100px;
}

Although you might find using a negative margin moves the box 300px to the left of where it is now - because a margin is already defined on the style in my earlier post.

Unless there is a reason not to change this style then my earlier post is the correct solution.
0
 
LVL 9

Author Closing Comment

by:Rowby Goren
ID: 39222695
Thanks, Julian.

I  went ahead and did the negative position.

Rowby
0
 
LVL 56

Expert Comment

by:Julian Hansen
ID: 39222755
You are welcome - thanks for the points.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question