Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 300
  • Last Modified:

Need some help with html/css layout

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
CavemanLawyer
Asked:
CavemanLawyer
  • 6
  • 3
1 Solution
 
LZ1Commented:
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
 
CavemanLawyerAuthor Commented:
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
 
CavemanLawyerAuthor Commented:
I applied the changes you suggested but was unable to fix the issue.
0
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!

 
LZ1Commented:
Can we see a live link?
0
 
CavemanLawyerAuthor Commented:
Sure, here is a link:

www.geniesgameroom.com/ee/
0
 
CavemanLawyerAuthor Commented:
bump?
0
 
CavemanLawyerAuthor Commented:
It looks centered but it is off to the left. Not sure why..
0
 
LZ1Commented:
Give the div that has the inline style of margin-left:30% the following CSS:

    margin: 0 auto;
    width: 481px;
0
 
CavemanLawyerAuthor Commented:
thanks
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!

  • 6
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now