webForumDet fria alternativet
Logga in / Bli medlem

Problem med länk

HTML & CSSur HTML, XHTML & CSS

9 svar · 376 visningar · startad av Flashes

Flashess avatarFlashesMedlem sedan jan. 2003282 inlägg
Frågan#1

Hej

på den här sidan http://www.savhammar.net/test/inloggning_jos.html
fungerar inte länken för mail.
I IE flyttar sig länken till höger och lite nedåt, sedan fungerar den.
I Firebird flyttar länken på sig så länge man håller musknappen nere, men länken fungerar inte.
I Opera fungerar länken.

Vad kan vara fel?
Fungerar mail länken för Er?

Mvh
Jan-Olov

frankofs avatarfrankofMedlem sedan jan. 20016 874 inlägg
#2

Ja, med lite ansträngning ;)
Klicka på lånken, flytta markören efter den flyende länken och släpp sedan musknappen :e
Varför använda script för en vanlig mailto-länk?

FatRats avatarFatRatMedlem sedan aug. 200356 inlägg
#3

frankof skrev:

Varför använda script för en vanlig mailto-länk?

Görs antagligen för att slippa spam-spindlar..

Flashess avatarFlashesMedlem sedan jan. 2003282 inlägg
#4

Stämmer, vill slippa spindlar.
Men det spelar ingen roll om jag tar bort scriptet, länken uppför sig likadant ändå.
Vet inte vad jag ska göra.

Mvh
Jan-Olov

@nderss avatar@ndersMedlem sedan juni 200032 969 inlägg
#5

Jag sätter en femma på att det är CSS:en som används på sidan som får länken att rymma. :)

Mvh

bossseMedlem sedan juni 2003772 inlägg
#6

Och så här ser den css-filen ut som anropas externt.
Den får man fatt på om man väljer "spara sidan som"

BODY {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #fff; PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #003174; PADDING-TOP: 0px; FONT-FAMILY: Arial, Helvetica, sans-serif; HEIGHT: 100%
}
HTML {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #fff; PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #003174; PADDING-TOP: 0px; FONT-FAMILY: Arial, Helvetica, sans-serif; HEIGHT: 100%
}
H1 {
	MARGIN: 0px; FONT: bold 150% Verdana, Arial, Helvetica, sans-serif; COLOR: #003366; BACKGROUND-COLOR: transparent
}
H2 {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 20px; FONT: bold 100% Verdana, Arial, Helvetica, sans-serif; COLOR: #003366; PADDING-TOP: 0px; BACKGROUND-COLOR: transparent
}
H3 {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 10px 20px; FONT: bold 90% Verdana, Arial, Helvetica, sans-serif; COLOR: #000000; PADDING-TOP: 0px; BACKGROUND-COLOR: transparent
}
P {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; FONT: bold 80% Verdana, Arial, Helvetica, sans-serif; VERTICAL-ALIGN: bottom; COLOR: #000000; PADDING-TOP: 0px
}
P.indent {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 10px 20px; FONT: bold 80% Verdana, Arial, Helvetica, sans-serif; VERTICAL-ALIGN: bottom; COLOR: #000000; PADDING-TOP: 0px
}
A:link {
	COLOR: #006699; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:active {
	COLOR: #006699; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:visited {
	COLOR: #006699; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:hover {
	COLOR: red; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline
}
.clear {
	CLEAR: both; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
#back {
	PADDING-RIGHT: 15px; PADDING-LEFT: 15px; Z-INDEX: 4; MIN-HEIGHT: 400px; LEFT: 50%; PADDING-BOTTOM: 15px; MARGIN: 20px 0px 0px -276px; WIDTH: 560px; PADDING-TOP: 15px; POSITION: absolute; TOP: 0%; HEIGHT: 450px; BACKGROUND-COLOR: #fff
}
#head {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; Z-INDEX: 3; PADDING-BOTTOM: 0px; MARGIN: 0px 10px 60px; WIDTH: 520px; COLOR: #000; PADDING-TOP: 0px; BORDER-BOTTOM: #003174 1px solid; POSITION: absolute; min-width: 240px
}
#head IMG {
	Z-INDEX: 2; MARGIN: -2.5em -2em 0em 80%; POSITION: absolute
}
.content {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; Z-INDEX: 3; PADDING-BOTTOM: 5px; MARGIN: 25px 10px 10px; WIDTH: 520px; COLOR: #003174; PADDING-TOP: 5px; POSITION: relative; min-width: 240px
}
.content INPUT {
	Z-INDEX: 2; MARGIN: -1.5em -2em 0em 35%; POSITION: absolute
}
.content A:link {
	MARGIN: 1em 0em 0em 35%; FONT: bold 80% Verdana, Arial, Helvetica, sans-serif; COLOR: #006699; POSITION: absolute; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:active {
	MARGIN: 1em 0em 0em 35%; FONT: bold 80% Verdana, Arial, Helvetica, sans-serif; COLOR: #006699; POSITION: absolute; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
A:visited {
	MARGIN: 1em 0em 0em 35%; FONT: bold 80% Verdana, Arial, Helvetica, sans-serif; COLOR: #006699; POSITION: absolute; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.content A:hover {
	COLOR: red; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline
}
#back #footer {
	PADDING-RIGHT: 0px; BORDER-TOP: #003174 1px solid; PADDING-LEFT: 0px; Z-INDEX: 3; PADDING-BOTTOM: 0px; MARGIN: 55px 10px 0px; WIDTH: 520px; COLOR: #000; PADDING-TOP: 0px; POSITION: absolute; min-width: 240px
}
FatRats avatarFatRatMedlem sedan aug. 200356 inlägg
#7

Nej den ser ut såhär:

body, html {
	margin : 0px;
	padding : 0px;
	height : 100%;
	padding-left : 0px;
	font-family: Arial, Helvetica, sans-serif;
	color : #003174;
	background : #fff;
}

h1 {
	margin: 0px;
	font: bold 150% Verdana, Arial, Helvetica, sans-serif;
	background-color: transparent; 
	color: #003366;
}

h2 {
	margin: 0px 0px 0px 20px;
	font: bold 100% Verdana, Arial, Helvetica, sans-serif;
	background-color: transparent; 
	color: #003366;
	padding: 0px;   
}

h3 {
	margin: 0px 0px 10px 20px;
	font: bold 90% Verdana, Arial, Helvetica, sans-serif;
	background-color: transparent; 
	color: #000000;
	padding: 0px;
}

p {
	font: bold 80% Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	padding: 0px;
	margin: 0px;
	vertical-align: bottom;
}

p.indent {
	font: bold 80% Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	padding: 0px;
	margin: 0px 0px 10px 20px;
	vertical-align: bottom;
}

a:link, a:active, a:visited {
	color : #006699;
	background-color: transparent; 
	text-decoration: none;
}

a:hover {
	color : red;
	background-color: transparent; 
	text-decoration: underline;
}

.clear	{
	clear: both;
	font-size: 0px;
	margin: 0px;
	padding: 0px;
}

#back {
	position: absolute;
        top: 0%;
        left: 50%;
        margin: 20px 0px 0px -276px;
        padding: 15px;
        width: 560px;
        height: 450px;
        min-height: 400px;
        background-color: #fff;
        z-index: 4;
}

#head {
	position: absolute;
        width: 520px;
        min-width: 240px;
        margin: 0px 10px 60px 10px;
        border-bottom: 1px solid #003174;
        color: #000;
        padding: 0px;
        z-index: 3;
}

#head img { 
	position: absolute;
	margin: -2.5em -2em 0em 80%;
	z-index: 2;
}

.content {
	position: relative;
        width: 520px;
        min-width: 240px;
        margin: 25px 10px 10px 10px;
        color: #003174;
        padding: 5px;
        z-index: 3;
}

.content input {
	position: absolute;
	margin: -1.5em -2em 0em 35%;
	z-index: 2;
}

.content a:link, a:active, a:visited {
	font: bold 80% Verdana, Arial, Helvetica, sans-serif;
	position: absolute;
	margin: 1em 0em 0em 35%; 
	color : #006699;
	background-color: transparent; 
	text-decoration: none;
}

.content a:hover {
	color : red;
	background-color: transparent; 
	text-decoration: underline;
}

#back #footer {
	position: absolute;
        width: 520px;
        min-width: 240px;
        margin: 55px 10px 0px 10px;
        border-top: 1px solid #003174;
        color: #000;
        padding: 0px;
        z-index: 3;
}

Sådär tolkar däremot din webläsare koden ;)

FatRats avatarFatRatMedlem sedan aug. 200356 inlägg
#8

I övrigt så verkar det lite rörigt tycker jag..
ta tex.

	<div id="footer">
	<p><font color="666666">Vid frågor, kontakta Biblioteket:<br />
	Telefon: 012-34 56 78, </font> <a href="javascript:mail('gorsa832','student.liu.se')">maila</a></p>
	<div class="clear"></div>
	</div>

Där borde du kunna nöja dig med antingen <p></p> eller <div></div>..

som det är nu har du ju både div p och font..och a som ju också har en css kopplad..

Flashess avatarFlashesMedlem sedan jan. 2003282 inlägg
#9

Jo, det blev så när jag försökte få länken att sluta röra på sig

Flashess avatarFlashesMedlem sedan jan. 2003282 inlägg
#10

Löste det genom att lägga till en klass för länkarna som ligger i foot
margin: 0px;

Firebird fungerar fortfarande inte som jag vill, men det ser jag mer som ett problem i Firebird än i koden på sidan.

Mvh
Jan-Olov

136 ms totalt · 3 externa anrop · v20260731065814-full.55e59744
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
132 ms — hämta tråd, inlägg och bilagor (db)