More website help - css experts required

ShawWellPete

ShawWellPete

Messages
3,699
Name
Pete
Edit My Images
Yes
Hi all,

I hope you don't mind, I'm after some help again. I have updated www.villabegur.com and I'm pretty happy with the way it looks on Firefox but I have a couple of issues with ie.

I have learnt basic CSS and replaced my graphical menu links with CSS ones which are a lot quicker. When using ie the links are underlined unless the link has been visited. Any idea how I can stop this happening?

I did try to add css rules for visited and link defining no underline but it makes no difference - here are the rules...

.rolloverbutton {
font-family: Rockwell;
font-size: 18px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-decoration: none;
background-color: #003300;
background-repeat: no-repeat;
color: #FFFFFF;
}
a.rolloverbutton:hover {
font-family: Rockwell;
font-size: 18px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #0033FF;
background-color: #003300;
text-decoration: none;
}
a.rollover:link {
font-family: Rockwell;
font-size: 18px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-decoration: none;
background-color: #003300;
background-repeat: no-repeat;
color: #FFFFFF;
}
a.rollover:visited {
font-family: Rockwell;
font-size: 18px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-decoration: none;
background-color: #003300;
background-repeat: no-repeat;
color: #FFFFFF;
}
a.rollover:active {
font-family: Rockwell;
font-size: 18px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-decoration: none;
background-color: #003300;
background-repeat: no-repeat;
color: #FFFFFF;


The other problem only occurs in the latest version of ie. The images move when you hover over them (here for example). The galleries where created in Lightroom then edited in Dreamweaver.

Thanks in advance for any help!
 
You could really simplify all the css on that site :)

eg. for those links:
a.rolloverbutton:link, a.rolloverbutton:visited {
font-family: Rockwell;
font-size: 1em;
text-decoration: none;
color: #FFFFFF;
}
a.rolloverbutton:hover, a.rolloverbutton:active {
font-family: Rockwell;
font-size: 1em;
color: #0033FF;
}

Though you really shouldn't use Rockwell as a lot of people won't have it. You're best sticking with the basics, eg. verdana, arial, tahoma, times, etc...
 
SW4peter said:
Thanks for that guys. What happens if you use a font somebody hasn't got?
Click to expand...

then it appears in their default font.

Best is to set several fonts for the text, so the page at least appears roughly how you want it to.

Although its a good rule to use basic 'web safe' fonts that almost everyone should have. Whether these are your 1st, 2nd or 3rd choice fonts is upto you.

And since i despide ie, and therefore do not want that monstrousity that is ie7, in what way do the images move?

I would also remove your email address from the contact page. Spam bots will easuly harvest that. Best is to either encrypt it using javascript, or put it as an image (bots cant read either), or use a contact form that process's the forms content and sends you an email (that requires server side scripting).

And i think the menu can be spiced up using more simple CSS

:)
 
could be something to do that they're linking to another page. ie sees them as just another link..

i also notice you have styles in the body section, all the styles should go either in the head section or in a seperate style sheet. The inline styles you have used can also go in a style sheet.

Theres alot of code for a simple page there too. You can easily reduce that by using divs, and not tables. (less code = less loading time = less bandwidth = less money been spent = less people leaving before page is fully loaded = more people to buy your product)

Theres no doctype on the site, that could cause some of your issues too, like the images moving in ie.
 
Thanks very much for taking the time to do that Slapo, I'll download it when I get back from work tonight and see if I can clean up the rest of the site.

I'm not sure if I'll be able to lose my pebble background to the title bar though...:crying:

SL - Thanks for your comments too, much appreciated
 
SurrealIllusions and Slapo, thanks again for your help. I think I'm going to be struggling to redesign the site completely as I am very much of an amateur at this and I'm starting to get out of my depth.

I started out with some simple design in Dreamweaver, using templates for consistency then added some lightroom galleries. These use CSS so changed the site in a way I wasn't expecting so I have been reading up a bit about CSS in order to correct the look of the site.

Your advice has been very useful and although I don't think I have the time or the ability to implement all the changes I shall carry on fiddling to make some of the improvements you suggest and see how I get on...
 
You must log in or register to reply here.
Back
Top