---
title: "Media i CSS-får det inte att funka"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/179027-media-i-css-får-det-inte-att-funka"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "Isza-96"
published: "2009-06-17T08:46:03.000Z"
updated: "2009-06-17T11:25:26.000Z"
replies: 6
views: 452
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/179027-media-i-css-får-det-inte-att-funka"
---

# Media i CSS-får det inte att funka

## #1 — Isza-96, 2009-06-17T08:46Z

Jag ska försöka göra min sida utskriftvänlig med hjälp av @media print i mitt CSS-dokument. Det har fungerat vid ett tidigare tillfälle då jag hade en liten och väldigt enkel webbplats. 

Den jag gör nu är något större men det borde ju funka utan problem ändå. Har jag missat något eller är det något som ska bort?

```
body {
margin: 0;
padding: 0;
margin-top: 0;
margin-bottom: 0;
background-color: #0066cc;
}

a {
color: #000099;
text-decoration: none;
}

#hela {

width: 770px;
font-size: 100%; 
margin-left: 450px;
margin-bottom: 0;
line-height: 150%; 
background-color: #FFFFFF;
}

}

#tid {
position: absolute;
top: 150px;
left: 770px;
}

h1{
color: black;
font-family: verdana, sans-serif;
font-size: 100%;
line-height: 150%;
margin-bottom: 20px;
margin-top: 30px;
margin-left: 100px;

}

.ingress{
font-size: 75%;
font-weight: bold;}

#reling {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

#guldskepp {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#platinaskepp {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#diamantskepp {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#nrettskepp {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#mandraki {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#oia {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

#ephesosamfiteater {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

#mykonos {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

#knossos {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#limassol {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#rhodosdelfin {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

#akropolis {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#bordsdekoration {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#massage {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#casino {
margin-left: 100px;
margin-right: 465px;
border-color: #004181;
Border-style: solid;
}

#faq {
margin-left: 100px;
margin-right: 315px;
border-color: #004181;
Border-style: solid;
}

p{
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
margin-top: 10px;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 100px;
margin-right: 100px;
line-height: 150%;
}

h2{
color: black;
font-family: verdana, sans-serif;
font-size: 85%;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 100px;
line-height: 150%;
}

h3{
color: black;
font-family: verdana, sans-serif;
font-size: 90%;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 100px;
line-height: 150%;
}

h4 {
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
font-weight:bold;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 100px;
line-height: 150%;
}

#meny{
width: 100%;
margin-top: -14px;
margin-bottom: 20px;
background-color: #bfdfff;
text-align: left;
font-size: 85%;
padding: 0;
}

#menu ul{
padding: 20px 10px 0 0;
}

#meny li{
display: inline;
margin: 1px 1px 1px 1px;
}

#meny a{
color: #004181;
text-decoration: none;
padding: 0 10px 0 10px;
}

#meny a:hover{
color: red;
text-decoration: underline;
}

#meny a:visited {
color: black
}

#undermeny {
position: absolute;
margin-left: -90px;
width: 30px;
margin-top: 87px;
}

#nyheter {
position: absolute;
margin-left: -90px;
width: 40px;
margin-top: 115px;
font-size: 75%;
}

#kontakt {
margin-left: 90px;
font-size: 75%;
top: 985px;
margin-bottom: 0;
}

#faktaruta1 {
margin-left: 70px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

#faktaruta2 {
margin-left: 70px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

#faktaruta3 {
margin-left: 70px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

#faktaruta4 {
margin-left: 70px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

#komihåg {
margin-left: 70px;
margin-right: 100px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

#kontakt {
margin-left: 90px;
font-size: 75%;
top: 985px;
margin-bottom: 0;
}

.clearfix{
margin-left: 100px;
color: black;
font-family: verdana, sans-serif;
font-size: 75%;
}

.mail {
margin-left: 135px;
font-size: 75%;
top: 985px;
margin-bottom: 0;
}

@media print {
font-family: Georgia; serif; 
font-size: 12pt;}

@media print {
#hela {width: 770pt;}

@media print {
#reling {display: none;}

@media print {
#guldskepp {display: none;}

@media print {
#platinaskepp {display: none;}

@media print {
#diamantskepp {display: none;}

@media print {
#nrettskepp {display: none;}

@media print {
#mandraki {display: none;}

@media print {
#oia {display: none;}

@media print {
#ephesosamfiteater {display: none;}

@media print {
#mykonos {display: none;}

@media print {
#knossos {display: none;}

@media print {
#limassol {display: none;}

@media print {
#rhodosdelfin {display: none;}

@media print {
#akropolis {display: none;}

@media print {
#bordsdekoration {display: none;}

@media print {
#massage {display: none;}

@media print {
#casino {display: none;}

@media print {
#faq {display: none;}
```

Permalänk: https://www.webforum.nu/p/179027

## #2 — voigtann1, 2009-06-17T08:58Z

Om du kolla i din css kod så öppnar du mer { än vad du stänger, men helst eller vad jag tycker är enklare är att du skapar en egen CSS fil för print och kör html kod för det:

```
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
```

Eller så (har ingen aning om det fungera men):

```
@media print {
	body {font-family: Georgia; serif; font-size: 12pt;}
	#hela {width: 770pt;}
	#reling {display: none;}
	#guldskepp {display: none;}
	#platinaskepp {display: none;}
	#diamantskepp {display: none;}
	#nrettskepp {display: none;}
	#mandraki {display: none;}
	#oia {display: none;}
	#ephesosamfiteater {display: none;}
	#mykonos {display: none;}
	#knossos {display: none;}
	#limassol {display: none;}
	#rhodosdelfin {display: none;}
	#akropolis {display: none;}
	#bordsdekoration {display: none;}
	#massage {display: none;}
	#casino {display: none;}
	#faq {display: none;}
}
```

, eller hellst kanske tom:

```
@media print {
	body {font-family: Georgia; serif; font-size: 12pt;}
	#hela {width: 770pt;}
	#reling, #guldskepp, #platinaskepp, #diamantskepp,
	#nrettskepp, #mandraki, #oia, #ephesosamfiteater,
	#mykonos, #knossos, #limassol, #rhodosdelfin,
	#akropolis, #bordsdekoration, #massage, #casino, #faq
	{
		display: none;
	}
}
```

Eller sätt en klass på alla dina element som skall vara dålda vid print istället för att lägga in alla idn du har i ditt dokument.

Permalänk: https://www.webforum.nu/p/2190850

## #3 — Isza-96, 2009-06-17T09:22Z

Tack för hjälpen!

Jag tog bort alla "öppningar" som inte stängdes och vips så funkade det!

Permalänk: https://www.webforum.nu/p/2190854

## #4 — voigtann1, 2009-06-17T09:33Z

Vad bra!

Sätt tråden som löst så andra hittar svar på liknande problem snabbt ;)

Permalänk: https://www.webforum.nu/p/2190855

## #5 — Isza-96, 2009-06-17T09:35Z

Hur gör man det? Är ganska ny här..:-)

Permalänk: https://www.webforum.nu/p/2190856

## #6 — voigtann1, 2009-06-17T09:50Z

Till höger så ser du på varje svar som finns i en tråd, tryck på länken "Acceptera som slutgiltigt svar", done ;)

Permalänk: https://www.webforum.nu/p/2190858

## #7 — Isza-96, 2009-06-17T11:25Z

Tack!!

Permalänk: https://www.webforum.nu/p/2190870

---

Tråden på webben: https://www.webforum.nu/amne/html-css/179027-media-i-css-får-det-inte-att-funka