17 svar · 647 visningar · startad av godfather78
Hej!
Fråga1:Jag har en hemsida som är kodad i CSS och jag får den inte att bli centrerad.
(jag har gjort hemsidan i photoshop om de är en viktig information)
Fråga2:
Jag har även försökt att få en ikon på hemsidan alltså bredvid adressen till hemsidan.
ex: [IKON] http://www.swebits.org.
Men det är så att ikon bilden inte visas och jag undrar då hur jag gör så att den visas.
mvh r
body { text-align:center; }
omslutandeblockelement { margin:0px auto; }
i din css??
<link rel="shortcut icon" href="favicon.ico" />
centreringen funkade inte med ikon koden funka, konstigt när jag testa samma sak i skolan idag och de funkade inte :/
nån som vet hur jag ska göra för att få sidan centrerad?
en i min klass sa något om tabels? kan de vara nåt sånt?
okej, hur kodar du sidan?
hur mycket kunskaper har du i html? css?
jag har som sagt gjort sidan första i photoshop.
och jag har en en del kunskaper i html och css men jag har inte hittat nånting där de står hur man centrerar. har försökt väldigt mycket.
okej
men om du gör sidan i photoshop spelar ju ingen roll om du försöker dig på css nu, eftersom css styr html och inte bilder i photoshop
jag vet inte om vi pratar förbi varandra, det känns lite så
kodar du sidan något just nu eller jobbar du bara med bilderna?
godfather78 skrev:
centreringen funkade inte med ikon koden funka, konstigt när jag testa samma sak i skolan idag och de funkade inte :/
nån som vet hur jag ska göra för att få sidan centrerad?
en i min klass sa något om tabels? kan de vara nåt sånt?
Jag ser ingen icon i adressfältet och du har ingen länk till den i koden?
Vad är det som inte centrerar för dig? Vad jag kan se så är allt centrerat, både i IE och i min SeaMonkey webbläsare.
Kolla din HTML-kod med http://validator.w3.org/
Kolla också CSS-koden med http://jigsaw.w3.org/css-validator/
Du har en hel del fel i båda, som bör rättas till.
P.S. Photoshop är ett bildbehandlingsprogram och inte en webbeditor. Använd programmen till vad de är avsedda för och inte till annat. Även om de kan göra lite annat så gör dom det dåligt! §jr
mozfan dumma kommentarer du skriver :/
photoshop+imageready gör mycket fina hemsidor.
förstår inte riktigt vad du menar
godfather78 skrev:
mozfan dumma kommentarer du skriver :/
photoshop+imageready gör mycket fina hemsidor.
förstår inte riktigt vad du menar
Nej han skriver inga dumma kommentarer. Nej photoshop+imageready gör inte fina hemsidor. Om du inte förstår borde du läsa på dig mer om ämnet.
Kan du inte länka till sidan eller klistra in all din kod här?
Vad menar du med centrerad? Ska texten centreras eller ska innehållet smalnas av mot mitten, så det blir luft på båda sidorna?
hela hemsidan ska bli centrerad.
style.css
#banner {
position:absolute;
left:0px;
top:0px;
width:570px;
height:213px;
}
#index-02 {
position:absolute;
left:0px;
top:213px;
width:570px;
height:12px;
}
#index-03 {
position:absolute;
left:0px;
top:225px;
width:46px;
height:405px;
}
#hem {
position:absolute;
left:46px;
top:225px;
width:83px;
height:40px;
}
#index-05 {
position:absolute;
left:129px;
top:225px;
width:15px;
height:64px;
}
#teamet {
position:absolute;
left:144px;
top:225px;
width:83px;
height:40px;
}
#index-07 {
position:absolute;
left:227px;
top:225px;
width:18px;
height:64px;
}
#filmtips {
position:absolute;
left:245px;
top:225px;
width:82px;
height:40px;
}
#index-09 {
position:absolute;
left:327px;
top:225px;
width:19px;
height:64px;
}
#lankar {
position:absolute;
left:346px;
top:225px;
width:82px;
height:40px;
}
#index-11 {
position:absolute;
left:428px;
top:225px;
width:19px;
height:64px;
}
#kontakt {
position:absolute;
left:447px;
top:225px;
width:83px;
height:40px;
}
#index-13 {
position:absolute;
left:530px;
top:225px;
width:40px;
height:405px;
}
#index-14 {
position:absolute;
left:46px;
top:265px;
width:83px;
height:24px;
}
#index-15 {
position:absolute;
left:144px;
top:265px;
width:83px;
height:24px;
}
#index-16 {
position:absolute;
left:245px;
top:265px;
width:82px;
height:24px;
}
#index-17 {
position:absolute;
left:346px;
top:265px;
width:82px;
height:24px;
}
#index-18 {
position:absolute;
left:447px;
top:265px;
width:83px;
height:24px;
}
#index-19 {
position:absolute;
left:46px;
top:289px;
width:15px;
height:341px;
}
#text {
position:absolute;
left:61px;
top:289px;
width:453px;
height:286px;
}
#index-21 {
position:absolute;
left:514px;
top:289px;
width:16px;
height:341px;
}
#index-22 {
position:absolute;
left:61px;
top:575px;
width:453px;
height:11px;
}
#index-23 {
position:absolute;
left:61px;
top:586px;
width:128px;
height:44px;
}
#copyright {
position:absolute;
left:189px;
top:586px;
width:207px;
height:35px;
}
#index-25 {
position:absolute;
left:396px;
top:586px;
width:118px;
height:44px;
}
#index-26 {
position:absolute;
left:189px;
top:621px;
width:207px;
height:9px;
}
h1 {
text-align:center;
font-family:verdana;
font-size:28px;
font-style:normal;
font-weight:bold;
text-decoration:;
margin:10px;
color:#484848;
}
h2 {
text-align:center;
font-family:verdana;
font-size:19px;
font-style:normal;
font-weight:none;
text-decoration:none;
margin:10px;
color:#484848;
}
index.html
<HTML>
<HEAD>
<TITLE>pirat3rna</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="favicon.ico" />
</HEAD>
<BODY STYLE="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<DIV ID="banner">
<IMG SRC="images/banner.gif" WIDTH=570 HEIGHT=213 ALT="">
</DIV>
<DIV ID="index-02">
<IMG SRC="images/index_02.gif" WIDTH=570 HEIGHT=12 ALT="">
</DIV>
<DIV ID="index-03">
<IMG SRC="images/index_03.gif" WIDTH=46 HEIGHT=405 ALT="">
</DIV>
<DIV ID="hem">
<A HREF="index.html" TARGET="_self">
<IMG SRC="images/hem.gif" WIDTH=83 HEIGHT=40 BORDER=0 ALT=""></A>
</DIV>
<DIV ID="index-05">
<IMG SRC="images/index_05.gif" WIDTH=15 HEIGHT=64 ALT="">
</DIV>
<DIV ID="teamet">
<A HREF="teamet.html" TARGET="_self">
<IMG SRC="images/teamet.gif" WIDTH=83 HEIGHT=40 BORDER=0 ALT=""></A>
</DIV>
<DIV ID="index-07">
<IMG SRC="images/index_07.gif" WIDTH=18 HEIGHT=64 ALT="">
</DIV>
<DIV ID="filmtips">
<A HREF="filmtips.html" TARGET="_self">
<IMG SRC="images/filmtips.gif" WIDTH=82 HEIGHT=40 BORDER=0 ALT=""></A>
</DIV>
<DIV ID="index-09">
<IMG SRC="images/index_09.gif" WIDTH=19 HEIGHT=64 ALT="">
</DIV>
<DIV ID="lankar">
<A HREF="lankar.html" TARGET="_self">
<IMG SRC="images/lankar.gif" WIDTH=82 HEIGHT=40 BORDER=0 ALT=""></A>
</DIV>
<DIV ID="index-11">
<IMG SRC="images/index_11.gif" WIDTH=19 HEIGHT=64 ALT="">
</DIV>
<DIV ID="kontakt">
<A HREF="kontakt.html" TARGET="_self">
<IMG SRC="images/kontakt.gif" WIDTH=83 HEIGHT=40 BORDER=0 ALT=""></A>
</DIV>
<DIV ID="index-13">
<IMG SRC="images/index_13.gif" WIDTH=40 HEIGHT=405 ALT="">
</DIV>
<DIV ID="index-14">
<IMG SRC="images/index_14.gif" WIDTH=83 HEIGHT=24 ALT="">
</DIV>
<DIV ID="index-15">
<IMG SRC="images/index_15.gif" WIDTH=83 HEIGHT=24 ALT="">
</DIV>
<DIV ID="index-16">
<IMG SRC="images/index_16.gif" WIDTH=82 HEIGHT=24 ALT="">
</DIV>
<DIV ID="index-17">
<IMG SRC="images/index_17.gif" WIDTH=82 HEIGHT=24 ALT="">
</DIV>
<DIV ID="index-18">
<IMG SRC="images/index_18.gif" WIDTH=83 HEIGHT=24 ALT="">
</DIV>
<DIV ID="index-19">
<IMG SRC="images/index_19.gif" WIDTH=15 HEIGHT=341 ALT="">
</DIV>
<DIV ID="text">
\<h1\>HEM\</h1\>
\<h2\>Välkomna!\</h2\>
\<IMG SRC="images/text.gif" WIDTH=453 HEIGHT=286 ALT=""\>
</DIV>
<DIV ID="index-21">
<IMG SRC="images/index_21.gif" WIDTH=16 HEIGHT=341 ALT="">
</DIV>
<DIV ID="index-22">
<IMG SRC="images/index_22.gif" WIDTH=453 HEIGHT=11 ALT="">
</DIV>
<DIV ID="index-23">
<IMG SRC="images/index_23.gif" WIDTH=128 HEIGHT=44 ALT="">
</DIV>
<DIV ID="copyright">
<IMG SRC="images/copyright.gif" WIDTH=207 HEIGHT=35 ALT="">
</DIV>
<DIV ID="index-25">
<IMG SRC="images/index_25.gif" WIDTH=118 HEIGHT=44 ALT="">
</DIV>
<DIV ID="index-26">
<IMG SRC="images/index_26.gif" WIDTH=207 HEIGHT=9 ALT="">
</DIV>
</BODY>
</HTML>
Lägg följande efter öppnandet av bodyelementet:
<div id="wrapper">
Lägg följande före stängningen av bodyelementet:
</div>
Och lägg till följande i din cssfil:
body {
text-align: center;
margin: 0px;
}
#wrapper {
text-align: left;
margin: 0px auto;
width: 0px; /* ändra 0px till den bredd du vill att centreringen skall ha */
}
oh my...
först och främst, det är klart att inte sidan blir centrerad när du använder dig av absolut positionering mot body.
lägg allt i en omslutande div och använd det som jag angav högst upp, lägg till position:relative
wuiqed: ditt trick funka tyvärr inte.
caya:tror inte riktigt jag förstår vad du menar lägg gärna in koderna och hur man gör.
Misstänker lite att du inte fick centreringen att fungera nu heller. Men deras Cayas och Wuiqeds beskrivningar är helt rätt... och både Mozfan och Okkido har också rätt, det här är inte ett snyggt sätt att koda sin hemsida på.
Bestäm dig för en Doctype, vilket du måste ha för att få vissa css-saker att fungera.
Ändra hela dokumentet till små bokstäver med fnuttar, ta bort sånt som inte är tillåtet osv... validera... och sedan har du nog fått sidan centrerad.
jo med det är så att hemsidan bara är uppbyggd med bilder
har ändrat allt till små bokstäver funkar ändå inte.
Vad har du valt för Doctype?
1. Lägg till
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
först i HTML-koden.
2. Ändra
<BODY STYLE="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
till
<BODY>
3. Lägg till
body { width:570px; margin:0 auto; position:relative; }
i stilmallen.