Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

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

I'm having trouble inserting an image in some html..

http://www.geniesgameroom.com/ee/

I am trying to put:

http://www.geniesgameroom.com/ee/images/headerbars.gif 

in between the menu options with the text at the middle of the bar. I tried vertical-align but it didn't work for me.

Please help me out

Thanks
0
CavemanLawyer
Asked:
CavemanLawyer
1 Solution
 
Dave BaldwinFixer of ProblemsCommented:
Try this:

<div style="margin: 0 auto; padding-left:30px">
	  <a href="#!/page_About" style="text-decoration:none"><strong>About</a>
<img src="images/headerbars.gif " >
	<a href="#!/page_Portfolio" style="text-decoration:none"><strong>Portfolio</strong></a>	
<img src="images/headerbars.gif " >
	<a href="#!/page_Services" style="text-decoration:none"><strong>My Services</strong></a>
<img src="images/headerbars.gif " >
	<a href="#!/page_Reviews" style="text-decoration:none"><strong>Reviews</strong></a>	
<img src="images/headerbars.gif " >
	<a href="#!/page_Contact" style="text-decoration:none"><strong>Contact</strong></a>
</div>

Open in new window

0
 
COBOLdinosaurCommented:
Wow!... 31 errors in validation?  Some of them serious and affecting rendering.  What Dave posted will have a better chance of working if you start from error free code.  As it stands the the page is wonky and unreliable.  You need to fix the code.

Cd&
0
 
CavemanLawyerAuthor Commented:
@DaveBaldwin - thanks but they just ended up clustered together on the portfolio link. I need them to be spaced between each menu option.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
CavemanLawyerAuthor Commented:
@COBOLdinosaur - Thanks. I will try to take care of the errors. How do I know what has errors?
0
 
CavemanLawyerAuthor Commented:
I was able to get it down to 7 errors - and those are for the contact form and the google map code. It did throw off a bunch of alignment I had though.
0
 
Dave BaldwinFixer of ProblemsCommented:
If they were "clustered together on the portfolio link", then something else is going on.  HTML simply doesn't work that way.
0
 
CavemanLawyerAuthor Commented:
Ok I fixed the alignment and made the changes that DaveBaldwin suggested but it still is clustered. I left the results saved so you can see what I am talking about.



http://www.geniesgameroom.com/ee/
0
 
CavemanLawyerAuthor Commented:
Any idea of what could be going on? I am using the following css for the menu and I think maybe it is effecting it somehow.

.topmenu a{ 
color:#ffffff;
position:relative;
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

0
 
Dave BaldwinFixer of ProblemsCommented:
Yes, your menu is re-generated by javascript and 'cufon' so what is in your HTML is not really what is being put on the page.  I don't know how to fix that.
0
 
CavemanLawyerAuthor Commented:
Ok thank you for your help. I appreciate it.


Does anyone know how to fix this issue?
0
 
HagayMandelCommented:
Few steps:

edit the sub div of the topmenu div the following way:

<div style="margin: 0 auto; width: 550px;">

Open in new window


Add a new css rule that applies to the images:

.topmenu img {
float: left;
}

Open in new window


From the .topmenu a css rule (line# 36 in style.css), remove: left: 30%;

Good luck

Hagay
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Oh, this is the same one I just helped you with.  I think your new layout does the trick.
0

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

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