Links doesn't work after..

Kromgol

07-21-2008, 11:55 PM

Hello all, i recently had a resolution problem which made so that when you change resolution the div moves away, but solved it by adding

#main {
text-align: left;
margin-right: auto;
margin-left: auto;
width: 1003px;
}
#all {
position: absolute;
width: 1003px;
}

Into the CSS and
<div id="main">
<div id="all"> to the html file so that it applies to all of the div's.

But then i got a new problem.. The links stopped working in my other div here:

<div style="text-align:center;"><p class="stil3 stil8 stil9"><img src="images/disk.jpg"

width="125" height="25" alt="disk" /><br /></p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index45.php?p=irc">>> IRC</a><br />
<a href="forum/index.php">>> Forum</a></span><br /></p><div

style="text-align:center;"><p class="stil2 stil3"><img src="images/animang.jpg" width="152"

height="25" alt="animang" /><br /> </p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index.php?p=manga">>> Manga

Lista</a><br />
<a href="index.php?p=animel">>> Anime Lista</a><br />
<a href="index.php?p=genrer">>> Genrer i Anime/Manga</a><br />
<a href="index.php?p=suffix">>> Namnsuffix</a></span><br />
</p><div style="text-align:center;"><p class="stil 2 stil3"><img src="images/media.jpg"

width="100" height="25" alt="media" /><br />
</p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index.php?p=wallpapers">>>

Wallpapers/Bilder</a><br />
<a href="index.php?p=downloads">>> Nerladdningar</a><br />
>> Filmer</span><br /></p>
<div style="text-align:center;"><a title="RSS Feed"

href="http://manganatio.110mb.com/cutenews/rss.php">
<img src="cutenews/skins/images/rss_icon.gif" alt="rss" />
</a></div>

Worked before the solution there, and i know that that piece of code was the cause of this, so help me solve it, please.

The CSS is:

.stil1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 24px;
}
.stil2 {
font-size: 22px;
font-family: Arial, Helvetica, sans-serif;
}
.stil3 {
font-size: 22px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.stil5 {
font-size: 10px
}

.stil7 {
font-size: 11px
}

a:link {
color: #8EB3EF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #8EB3EF;
}
a:hover {
text-decoration: none;
color: #f7cf15;
}
a:active {
text-decoration: none;
}
.stil8 {
font-family: Verdana, Arial, Helvetica, sans-serif
}
.stil9 {
font-size: 22px
}
.stil10 {
font-size: 14px
}

body {
background-color:#e5e6d8;
background-image: url(images/paper4.png);
margin-right: auto;
margin-left: auto;
}

#main {
text-align: left;
margin-right: auto;
margin-left: auto;
width: 1003px;
}
#all {
position: absolute;
width: 1003px;
}

#banner {
text-align:center;
left:10%;
position:absolute;
height:800px;
width:177px;
z-index:1;

}

#infobox {
background-color: #b9d1fc;
position:absolute;
opacity: .8;
width:250px;
height:80px;
top:130px;
left:10px;
margin:0px;
padding:0px;
border:1px #a2c2fb solid;
font-family: Verdana;
font-size:14px;
z-index:2;
}

#box {
background-color: #b9d1fc;
position:absolute;
opacity: .8;
width: 300px;
height: 140px;
top: 30px;
right: 40px;
border:1px #c9b974 solid;
font-family: Verdana;
font-size: 14px;
z-index:0;
margin-right: auto;
margin-left: auto;
}

#innehall {
position:absolute;
background-color:#fefffc;
top:175px;
right:103px;
width:645px;
border:1px #ece2c0 solid;
padding:0px;
margin: 0px auto;
padding: 0;
margin-right: auto;
margin-left: auto;
}

#Navigation {
position:absolute;
background-color:#fefffc;
top:175px;
left:100px;
border:1px #ece2c0 solid;
margin-right: auto;
margin-left: auto;
}

#copyright {
position:absolute;
top:800px;
left:3px;
font-size:9px;
font-family: Verdana;
}

Thanks in forehand..
/Kromgol

_Aerospace_Eng_

07-22-2008, 12:30 AM

What is the point of the #all div? Its not needed.

macwiz

07-22-2008, 04:00 AM

What do you mean stop working? You can't click on them, or the don't go to where they should?

Kromgol

07-22-2008, 10:06 AM

The #all div keeps the div's at their positions, without it, everything gets weird.

The links stopped working, you can't click them.

abduraooft

07-22-2008, 10:20 AM

Could you post complete code of your document? Or a link would be more useful.

Kromgol

07-22-2008, 10:26 AM

Ah well, i already found the problem: position:absolute; in the Navigation div.

It stops the links from being able to click on, but if i remove it the div gets out of position, tried relative, static, and even fixed, but nothing really worked.

Any help here? Otherwise, just come up with another solution that prevents my div's from moving apart from each other when changing screen resolutions.

The index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title>MangaNation - Din Anime och Manga Sida</title>
<meta name="verify-v1" content="P6dAA4+NcRmYPzX/7ffH20FUy6Js9jmWai+AGeTZ9oE=" />
<meta name="keywords" content="Manga, anime, lista, galleri, forum, community, nyheter, konnichiwa, japan, kawaii " />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="icon"
type="image/ico"
href="favicon.png" />
<link href="manganation.css" rel="stylesheet" type="text/css" />

</head>
<body>

<script type="text/javascript" src="http://susnet.se/susnetstat.js">
</script>
<script type="text/javascript">
susnet_counter_id = 53082;
susnet_security_code = '67ad0';
susnet_node=0;
register();
</script>

<div id="main">
<div id="all">
<div id="banner"><img src="images/banner.jpg" alt="banner" /></div>
<div id="infobox"><img src="images/veckansanime.png" alt="veckans" /></div>
<div id="box">dddd</div>
<div id="innehall">
<?php

switch ($_GET['p'])
{
case "start": include 'cutenews/show_news.php'; break;
case "archive": include 'cutenews/show_archives.php'; break;
case "faq": include 'faq.html'; break;
case "contact": include 'smtp.html'; break;
case "about": include 'omoss.html'; break;
case "irc": include 'irc.html'; break;
case "manga": include 'lista1.html'; break;
case "animel": include 'lista.html'; break;
case "genrer": include 'f1.html'; break;
case "suffix": include 'f2.html'; break;
case "wallpapers": include 'galleri.php'; break;
case "downloads": include 'nerladdningar.html'; break;
case "movies": include 'filmer.html'; break;

default: include 'cutenews/show_news.php'; break;

}
?>
<?php
include 'banner.html';
?>
</div>

<div class="stil1" id="Navigation">

<div style="text-align:center; z-index:2;"><p class="stil3 stil8 stil9"><img src="images/d-2.jpg" width="100" height="62" alt="d-1" /></p></div>
<div style="text-align:center;"><p class="stil3 stil8 stil9"><img src="images/nav.jpg" width="125" height="25" alt="disk" /></p></div>
<p class="stil3 stil5"><a href="index.php?p=start">>> Start</a><span class="stil7"><br />
<a href="index.php?p=archive">>> Nyhetsarkiv</a><br />
<a href="index.php?p=faq">>> FAQ</a><br />
<a href="index.php?p=contact">>> Kontakta Oss</a><br />
<a href="index.php?p=about">>> Om oss</a></span><br />

</p>
<div style="text-align:center;"><p class="stil3 stil8 stil9"><img src="images/disk.jpg" width="125" height="25" alt="disk" /><br /></p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index45.php?p=irc">>> IRC</a><br />
<a href="forum/index.php">>> Forum</a></span><br /></p><div style="text-align:center;"><p class="stil2 stil3"><img src="images/animang.jpg" width="152" height="25" alt="animang" /><br /> </p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index.php?p=manga">>> Manga Lista</a><br />
<a href="index.php?p=animel">>> Anime Lista</a><br />
<a href="index.php?p=genrer">>> Genrer i Anime/Manga</a><br />
<a href="index.php?p=suffix">>> Namnsuffix</a></span><br />
</p><div style="text-align:center;"><p class="stil 2 stil3"><img src="images/media.jpg" width="100" height="25" alt="media" /><br />
</p></div>
<p class="stil3 stil5"><span class="stil7"><a href="index.php?p=wallpapers">>> Wallpapers/Bilder</a><br />
<a href="index.php?p=downloads">>> Nerladdningar</a><br />
>> Filmer</span><br /></p>
<div style="text-align:center;"><a title="RSS Feed" href="http://manganatio.110mb.com/cutenews/rss.php">
<img src="cutenews/skins/images/rss_icon.gif" alt="rss" />
</a></div>

<div id="copyright">Copyright © Albin Westermark 2008, All rights reserved.<br />
Ornament brushes på <a href="http://magicalviper.deviantart.com/">MagicalViper</a> on Deviantart.</div>
</body>
</html>

Hope it helps.

Kromgol

07-22-2008, 10:30 AM

I solved it.. The navigation menu seems to have gotten under the all and main div, so i just put z-index:1; and it worked! Thanks anyway ;)