Improve company productivity with a Business Account.Sign Up

x
?
Solved

Need some help with html/css layout

Posted on 2013-01-10
9
Medium Priority
?
302 Views
Last Modified: 2013-01-11
I am trying to center the menu and add some images in the div. For some reason it seems off. It doesn't center well.
What is the best practice for top menus? I read something about centering in css > html.

Any help is appreciated.


.topmenu a{ 
color:#ffffff;
position:static;
float: left;
left:30%;
 margin: 15px;
-webkit-transition: margin 1.5s ease-out;
 -moz-transition: margin 1.5s ease-out;
 -o-transition: margin 1.5s ease-out;

} 
.topmenu a:hover { margin-top: 2px; color:#afa9d9} 

Open in new window


<div class="topmenu">	

	  <a href="#!/page_About"style="text-decoration:none"><strong>About</strong></a>
	<a href="#!/page_Portfolio"style="text-decoration:none"><strong>Portfolio</strong></a>	
	<a href="#!/page_Services"style="text-decoration:none"><strong>My Services</strong></a>
	<a href="#!/page_Reviews"style="text-decoration:none"><strong>Reviews</strong></a>	
	<a href="#!/page_Contact"style="text-decoration:none"><strong>Contact</strong></a>

	</div>

Open in new window

0
Comment
Question by:CavemanLawyer
  • 6
  • 3
9 Comments
 
LVL 30

Expert Comment

by:LZ1
ID: 38764706
Generally you would give your menu a width and then use margin:0 auto; to center it. I see you have position:static set right now, which would not work with the margin: 0 auto;. Are you trying to keep it on top of the other elements?
0
 

Author Comment

by:CavemanLawyer
ID: 38764757
There won't be anything under it but yes it would need to be the top layer. I was thinking about trying to use z index and make it a top layer. Just not sure what would work and what is best for browser comparability.
0
 

Author Comment

by:CavemanLawyer
ID: 38764862
I applied the changes you suggested but was unable to fix the issue.
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
LVL 30

Expert Comment

by:LZ1
ID: 38765424
Can we see a live link?
0
 

Author Comment

by:CavemanLawyer
ID: 38765498
Sure, here is a link:

www.geniesgameroom.com/ee/
0
 

Author Comment

by:CavemanLawyer
ID: 38765910
bump?
0
 

Author Comment

by:CavemanLawyer
ID: 38766093
It looks centered but it is off to the left. Not sure why..
0
 
LVL 30

Accepted Solution

by:
LZ1 earned 2000 total points
ID: 38766983
Give the div that has the inline style of margin-left:30% the following CSS:

    margin: 0 auto;
    width: 481px;
0
 

Author Closing Comment

by:CavemanLawyer
ID: 38768864
thanks
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
This is the conclusion of the review and tests for using two or more Password Managers so you don't need to rely on just one. This article describes the results of a lot of testing in different scenario's to reveal which ones best co-exist together.…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
How to create a custom search shortcut to site-search Experts Exchange using Google in the Firefox browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch your Bookmark Menu: Press 'Ctrl +…

588 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