View Full Version : Css

06-20-2012, 12:34 PM

I'm designing a website for a painter, though am having trouble with the css for the site www.edenwebbdesign.se.

The first page you come to functions ok, but when you click on the other pages, the navigationmenu and logo moves and also has a question mark symbol appear where there should be the swedish letters åäö.

The Gallery page is using Galleria image slider so have asked on that forum how to fix that.

I would be very grateful for your help,


06-20-2012, 12:52 PM
On the first page, you have

<ul id="nav">
<li><a href="index.html">Hem</a></li>
<li><a href="om_foretaget.html">Om Företaget</a></li>
<li><a href="tjanster.html">Tjänster</a></li>
<li><a href="galleri.html">Galleri</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
where as on the second page you have

<div id="nav">
<li class="active "><a href="index.html"><span>Hem</span></a></li>
<li><a href="om_foretaget.html"><span>Om F�retaget</span></a></li>
<li><a href="tjanster.html"><span>Tj�nster</span></a></li>

<li><a href="galleri.html"><span>Galleri</span></a></li>
<li><a href="kontakt.html"><span>Kontakt</span></a></li>

You need to change the encoding of the file to UTF-8, before saving the file with unicode letters. You may easily do this in Notepad++ by opting the 'UTF-8 without BOM' under Encoding tab.

PS: Why do you need to repeat the same codes on all pages? You may save all common codes in separate files use some serverside scripts like PHP to include them to the desired places.

06-20-2012, 04:11 PM
Also looks like the div "band navigation" is not closed on the internal pages.

06-20-2012, 09:38 PM
Thanks guys,

abduraooft, got the symbols away, though am still unsure what is wrong with the second page, is still making the menu become smaller and move right.

Am too much of a novice unfortunately to do anything with php. Thanks for the advice though.

aaronhockey_09, can't see what you mean about div band navigation? they seem closed when I highlight the foremost div at the start of the band.

06-21-2012, 12:21 AM
took a second look
and i think i found the problem.

on the first home page, your un ordered list item looks like this

<li><a href="index.html">Hem</a></li>

While on the internal pages it looks like this

<li><a href="index.html"><span>Hem</span></a></li>

remove the Span tags, and i think it should work properly.

06-21-2012, 12:23 AM
And it actually only seems to be the om_foretaget page that has this mistake

06-21-2012, 11:07 AM

Thanks for spotting the mistake. Took away the span tags, still same problem though :confused:
Also noticed that the logo and menu is still moving to the right on the Gallery page. The only thing I can think of is something to do with the padding or margin, but the css I have should be global.

06-21-2012, 11:37 AM
Now, your second page has

<ul id="nav">
<li><a href="index.html">Hem</a></li>
<li><a href="om_foretaget.html">Om Företaget</a></li>
<li><a href="tjanster.html">Tjänster</a></li>
<li><a href="galleri.html">Galleri</a></li>
<li><a href="kontakt.html">Kontakt</a></li>

Make use of validator for instances like this, see http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.edenwebbdesign.se%2Fom_foretaget.html

06-22-2012, 11:49 AM
Thanks abduraooft, have made the correction and now works perfectly :)

Will go through the entire website with validator and see what errors there are

You mentioned using php to have as a holder for common code elements. Could you explain at a novice level how it is done?

06-22-2012, 12:15 PM
Have a look at http://www.tizag.com/phpT/include.php or http://www.webmasterworld.com/html/3343922.htm

06-24-2012, 12:45 PM
Hi abduraooft.

I've now checked it with a validator.

Most of the pages are now fixed, however some of the pages still have errors that I don't understand.



Thanks for the links about the php, will do it with a test site after I'm done with this site so I can implement it later.

The only problems that seem to be with the site now is that the gallery page moves to the right when you click on the menu item, and a white area appears under the copyright statement area

06-24-2012, 03:53 PM
some of the errors in tjanster.html is because you have forgotten to close the alt attributes.

one error is because you have class="thumbnail edged" and class="rounded" within the same tag. You can only have one class="" for each element

the rest is because you, on the img have longdesc="" , which is both obsolete and not separated from the previous attribute by a space.
close the alt
remove all instances of longdesc=""
and merge the 2 class attributes:

... class="thumbnail edged rounded" ...

06-25-2012, 01:10 PM
Thanks Lerura,

Have now validated the page. The only problem that remains now is the problem with the Gallery page. What is it that makes the footer content move further up to the border of the content area and create the white space underneath the copyright section? Also the page still seems to move slightly to the right compared to the others.