View Full Version : Help! text enlarges on hover!

03-05-2011, 08:54 AM
Hi all, i have an issue with a site that i'm working on where the logo and navbar text enlarge when the mouse is hovered over it. Both items are situated in the header of the page. I am quite new to web design, particularly css so I only understand half of it!

Any helps is greatly appreciated.

03-05-2011, 10:14 AM
Link, code or crystal ball please :)

03-05-2011, 10:55 AM
lol, well i don't like to give out my crystal ball! The url is www.photoshopbeginner.co.uk

thanks in advance

03-05-2011, 11:04 AM
lol, well i don't like to give out my crystal ball!

Very wise ;)

I think the code that is messing you up is this;

a:hover (line 37){
background-color: inherit;
background-image: inherit;
background-repeat: inherit;
background-attachment: inherit;
background-position: inherit;
color: #006699;
text-decoration: underline;
font-size: 2em;

Try playing with the font size I have put in bold. Suggestion would be to use px (pixels) rather than em as a measurement.

03-05-2011, 11:47 AM
thanks for the suggestion, it has worked and stopped the text from expanding but it has however highlighted a new problem, would you mind checking the link again please, the error is on the navbar only now when you hover over it.

Thanks again

03-05-2011, 12:27 PM
#header-content li a:hover (line 280)


background-color: #65944a;

background-image: none;

background-repeat: repeat;

background-attachment: scroll;

background-position: 0% 0%;

color: #ffffff;

font-size: 1.3px;


1.3px is a very small font size ;)

03-05-2011, 12:33 PM
thanks again, i had changed the wrong property in the css. All sorted (for now lol). The support here is fantastic

d a v e
03-05-2011, 12:38 PM
still jumps on the contact link in the first page - if you check with the css validator you have errors

your text is also pretty small and you should use margins or padding on the <p> in the stylesheet to sort out spacing rather than using empty p's.

03-05-2011, 12:42 PM
The support here is fantastic

Please don't mistake help for support. We are just friendly folks who wanna help others. People have been ejected from here before for 'demanding' help like we are a helpdesk with paid staff!

Don't worry, we know what you meant and will take it as a massive compliment. Thank you. All we ask from you in return is to stick around and help others :)

03-05-2011, 12:59 PM
Looks like you have some fine Photoshop skills there by the way. What do you do for a living?

03-05-2011, 02:48 PM
ok, first off thanks for the support! I have fixed the errors on all the pages, I just haven't updated them yet. i should probably use a testing server instead of uploading it straight to the domain.

I will attempt to sort out the <p> in the stylesheet and check out the validators, thanks for the tip!

The photoshop skills are not my own, although I am more than competant with photoshop I cant take credit for work that isn't mine. Unfortunately it's hard to credit each one individually as finding the true source can be difficult sometimes.

I would also be glad to stick around and support others, i think I need to learn a little more myself first though before i could support others adequately.