Gå til innhold

CSS gir ingen endring på innholdet i div-tag

HetrTiXc

Av HetrTiXc
i Programmering og webutvikling

Anbefalte innlegg

HetrTiXc

HetrTiXc

Skrevet
Skrevet (endret)

Nå kan det fort hende jeg bare har gjort en elementær feil; har akkurat begynt å lære dette, men jeg klarer i alle fall ikke finne den. Problemet er at uansett hva jeg gjør så får jeg ikke endre no på stilegenskapene(ingen verdens ting) til elementene som er under meny/navigsjon i html-koden. Føler jeg har prøvd alt.

 

EDIT:

 

Link til Side

 

<html>
<head>
	<link rel="stylesheet" type="text/css" href="nyside2.css">
	<title>Min Side</title>
</head>
<body>
	<div id="banner">
		<h1>Min Side</h1>
	</div>
			<div id="navigasjon">
				<ul>
					<li><a href="http://www.hw.no">Element 1</a></li>
					<li><a href="http://www.hw.no">Element 2</a></li>
					<li><a href="http://www.hw.no">Element 3</a></li>
					<li><a href="http://www.hw.no">Element 4</a></li>
					<li><a href="http://www.hw.no">Element 5</a></li>
					<li><a href="http://www.hw.no">Element 6</a></li>
					<li><a href="http://www.hw.no">Element 7</a></li>
				</ul>
			</div>
			<div id="hoyre">
				<h3>Overskrift 2</h3>
				<p>sdfhwikehfskfbkwehfkshfksehfksf
				sdlfsldhflshfsdhflshfdlsfhlsdkfhslkhf
				sdføskdfhlshfdlshfdslhfslfhslhdfsdlhfks
				sldfsldfhslhdfslfhsldfhsldflskhfslkhfdsdl</p>
			</div>
			<div id="innhold">
				<h2>Overskriften min</h2>
				<p>sdfhwikehfskfbkwehfkshfksehfksf
				sdlfsldhflshfsdhflshfdlsfhlsdkfhslkhf
				sdføskdfhlshfdlshfdslhfslfhslhdfsdlhfks
				sldfsldfhslhdfslfhsldfhsldflskhfslkhfdsdl
				adfjsdlfksldhflskdflsdkflsdfjsldfjlsdjflsd
				sdfjsdfljsdælfjsædfjsdjfælsjfælskjdfælskjdf
				sdæflksdlæfjsldæjflsdjflsdjfsldjfsældjf
				sdjfælsdjfsldfjsdlfjsdlfjsldfkjsldfjs
				'øofjsældjfslædfjsldfjsldjfsldkjfjsældk
				sældfsældfjsøæfjsældfjlæskdfjlsækfjlksdjf
				spdojfslædfjslædfjsldkfjsldkfjsldfkjsdælfj
				æsldjflæskfjæslkfjæsldfjipwejrfoewijfweoei</p>
			</div>
	<div id="bunn">
		<ul>
			<li><a href="http://www.hw.no">fot1</a></li>
			<li><a href="http://www.hw.no">fot2</a></li>
			<li><a href="http://www.hw.no">fot3</a></li>
			<li><a href="http://www.hw.no">Copyright © Min Side</a>
		</ul>
	</div>
</body>
</html>

 

CSS

body
{
margin: auto;
width: 1000px;
padding-top: 3em;
font-family: georgia, times, "times new roman", serif;
color: #000;
background-color: #ddd;
	}

a:link
{
color: #036;
}

a:visited
{
color: #3d36dd;
}

a:hover
{
color: #fff;
background-color: #036;
}

div#banner
{
color: #fff;
background-image: url(toppen.jpg);
border-bottom: 5px solid #fff;
background-repeat: no-repeat;
}

div#banner h1
{
margin: 0;
padding: 60px 0 20px 1em;
font-size: 2.2em;
font-weight: normal;
}

div#navigasjon
{
float: left;
width: 180px;
padding-top: 2em;
padding-bottom: 2em;
background-image: url(menymal.jpg);
background-repeat: repeat-y;
}

div#navigasjon ul
{
list-style-type: none;
padding-left: 0.5em;
margin: 0;
}

div#navigasjon ul li
{
margin-top: 4px;
}

div#navigasjon ul li a
{
display: block;
width: 135px;
padding: 3px 5px 3px 10px;
text-decoration: none;
color: #000;
background-image: url(menyknapp4.jpg);
background-repeat: repeat-y;

)

div#hoyre
{
background-image: url(menymal2.jpg);
float: right;
width: 160px;
margin-left: 260px;
padding: 2em 10px 0 0;
color: #fff;
}

div#bunn
{
position: absolute;
left: 300px;
top: 500px;
}

 

Når jeg tenker meg om lurer jeg også på hvordan man ved hjelp av linker forandrer hovedinnholdet på sida(her: id=innhold). Det var greit når man brukte frames, men må innrømme at jeg er litt blank nå.

 

Takknemlig for all hjelp :)

Endret av HetrTiXc
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
affe90

affe90

Skrevet
Skrevet (endret)

Hei du! Flott at du tar initativet å lærer dette. Jeg fant feilen, tror jeg. Du har tullet og mikset litt når det gjaldt navn på DIV-er, og referering til DIV-er.

 

Du har gjort slik feks (legg merke til navnet div#banner):

 

div#banner{	
color: #fff;	
background-image: url(toppen.jpg);	
border-bottom: 5px solid #fff;	
background-repeat: no-repeat;	
}

 

Det må være slik (legg merke til navnendring og referering):

 

#banner{	
color: #fff;	
background-image: url(toppen.jpg);	
border-bottom: 5px solid #fff;	
background-repeat: no-repeat;	
}

 

Så problemet lå egentlig i bare CSS-en. Lykke til videre :)

Endret av Jørgen Pedersen
Lenke til kommentar
HetrTiXc

HetrTiXc

Skrevet
  • Forfatter
Skrevet

Nå ligger det link til siden i førsteposten. La forresten merke til at den ser helt misfostra ut i IE(i opera ser den helt grei ut). Blant annet så brydde den seg ikke om bredden jeg hadde spesifisert for body og noen elementer var litt malplassert. Noen som har peiling på hvorfor?

 

@Jørgen: testa det, men merka ingen forskjell

Lenke til kommentar
HetrTiXc

HetrTiXc

Skrevet
  • Forfatter
Skrevet (endret)

Fantastisk! Takk :grin: Det endra plutselig mye på sida og den så langt bedre ut i IE også.

 

Men jeg lurer fortsatt litt på hvordan det er vanlig å linke mellom flere deler av sida(type forandre innholdet i hoveddelen). Regner med at man ikke lager en side for hver del...

Endret av HetrTiXc
Lenke til kommentar
NuckChorris

NuckChorris

Skrevet
Skrevet

Du kan jo bruke et publiseringssystem for å forandre innhold, om det var noe sånt du mente.

 

På mine html/css nettsider lager jeg bare en ny "side" for hver link, men det er jo ikke noe stress med mindre du skal forandre på hele nettsiden. Om "skjelettet" er det samme så er det jo bare å kopiere koden fra forrige del, og linke til samme .css om den også skal være uforandret. Er i hvert fall slik jeg gjør det :)

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...