Forum Mjukvara Programmering och digitalt skapande Tråd

Behöver hjälp i webdesign, image kommer inte i mitten

1
Skriv svar
Permalänk
Medlem
●

Behöver hjälp i webdesign, image kommer inte i mitten

Jag har problem med att få min vita image precis under det andra vita. kolla p å bilderna så förstår ni vad jag menar

Såhär ska det se ut http://imageshack.us/photo/my-images/233/rttg.png/

såhär blir det http://imageshack.us/photo/my-images/444/fel.png/

Så hur gör jag för att det ska bli rätt?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

Klistra in html koden eller länka till sidan så kan folk få ta sig en liten titt.

Redigera
Citera flera Citera
Permalänk
Medlem
●

<html>
<head>
<title>Header</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:963px;
height:879px;
z-index:1;
left: 71px;
top: 118px;
}
-->
</style>
</head>
<body bgcolor="#2e98f1" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table align="center" width="1000" height="120" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="3"><img src="images/Header_01.gif" width="20" height="112" alt=""></td>
<td colspan="3">
<img src="images/Header_02.gif" width="960" height="70" alt=""></td>
<td rowspan="3">
<img src="images/Header_03.gif" width="20" height="112" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/Header_04.gif" width="960" height="3" alt=""></td>
</tr>
<tr>
<td>
<img src="images/Header_05.gif" width="17" height="39" alt=""></td>
<td>
<img src="images/Header_06.gif" alt="" width="926" height="39" border="0" usemap="#Map"></td>
<td>
<img src="images/Header_07.gif" width="17" height="39" a
lt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/Header_08.gif" width="1000" height="8" alt=""></td>
</tr>
</table>

<map name="Map">
<area shape="rect" coords="70,5,199,33" href="framsida.html">
<area shape="rect" coords="277,6,306,23" href="#">
<area shape="rect" coords="274,3,382,37" href="guider.html">
<area shape="rect" coords="453,5,527,36" href="klipp.html">
<area shape="rect" coords="612,7,684,35" href="#">
<area shape="rect" coords="611,2,689,36" href="bilder.html">
<area shape="rect" coords="775,1,796,15" href="#">
<area shape="rect" coords="767,1,857,34" href="bilder.html">
</map>
<div id="apDiv1">
<p><img src="Bilder/images/Untitled-2.gif" width="960" height="5000"></p>
<p> </p>
</div>
</body>
</html>

Redigera
Citera flera Citera
Permalänk
Medlem
●

Använd inte tabeller för layout!

Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Redigera
Citera flera Citera
Permalänk
Medlem
●

Om jag har fattat allt rätt nu så kan du gjöra såhär

<p style="text-align: center;"> <img src="Picture 0012.png" alt="The picture is unavailable." width="420" height="317"/> </p>

och bilden kommer att centreras vågrätt

Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem
●

Är det inte lättast att göra en css fil och köra lite divar för att setta header och border osv på den position där du vill ha den? Var ett tag sedan jag höll på med css och html

Redigera
Citera flera Citera
Permalänk
Medlem
●

Hade liknande problem när jag höll på med navmenyn på min sida, div:a och lägg till id.

#nav-menu
{
text-align:center;
margin:0 auto;
width: 884px;
}

Finns säkert bättre sätt att göra det det på men det funkade för, se till att du har width:xxx med bara.

P.S. Allt går lättare om du har en separat css-fil. Lite lättare att hålla reda på allting.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Det bästa är ju ändå att skriva om koden rätt, utan tabeller.
Något i stil med:

<div id="container" style="width:960px; margin:0 auto;"> <!--allt inom denna div är centrerat på sidan-->

     <div id="header" style="width:960px; height:112px; background:url('images/header.gif');"> <!--detta är headern, header.gif är headern-bilden-->
          <ul id="navigation"><!--Detta är menyn-->
               <li><a href="länk.html">Framsida</a></li>
               <li><a href="länk.html">Guider</a></li>
               <li><a href="länk.html">Klipp</a></li>
               <li><a href="länk.html">Bilder</a></li>
               <li><a href="länk.html">Övrigt</a></li>
          </ul><!--end navigation-->
     </div><!--end header-->

     <div id="content" style="width: 960px; background:#fff;"><!--Detta är innehållsrutan (den stora vita)-->
     </div><!--end content-->

</div> <!--end container-->

Nu är koden inte helt komplett men ger dig kanske en idé om hur du bör koda din sida. Forsksa runt lite!
Det går också lika bra att lägga alla "style=" i en separat CSS fil. T ex

div#container {
width: 960px;
margin: 0 auto;
}

En extern css-fil länkar du in genom att skriva följande kod mellan <head></head> i din kod

<link rel="stylesheet" href="stilmall.css" type="text/css" media="screen" />
Senast redigerat
Visa signatur

Phenom II X6 1055t @ 3,5GHz
Sleeva.se »

Redigera
Citera flera Citera
Permalänk
Medlem
●

Jag gjorde om det i photoshop tänkte det var lättast så, men nu har jag fått ett nytt problem. Ni får ursäkta min dumhet men det här är väldigt nytt för mig.

hur får jag bort scrollbaren som är längst ner http://imageshack.us/photo/my-images/9/namnlsmd.png/

<html>
<head>
<title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (Untitled-1) -->
<table id="Table_01" width="1600" height="1200" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="3">
<img src="images/Untitled-1_01.gif" width="337" height="1200" alt=""></td>
<td>
<img src="images/Untitled-1_02.gif" width="923" height="77" alt=""></td>
<td rowspan="3">
<img src="images/Untitled-1_03.gif" width="340" height="1200" alt=""></td>
</tr>
<tr>
<td>
<img src="images/Untitled-1_04.gif" width="923" height="40" alt=""></td>
</tr>
<tr>
<td>
<img src="images/Untitled-1_05.gif" width="923" height="1083" alt=""></td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>

Redigera
Citera flera Citera
Permalänk
Inaktiv
●

Ja... du kanske borde följa andras tips först.
Anledningen till att du har en scrollbar är för att du sätter att din tabell (vilket du verkligen inte ska använda för design) har en bredd av 1600px. Tänk på att olika personer har olika upplösningar, så även om du inte får en scrollbar när du ändrar den betyder inte det att andra inte får det.

Rekommenderar dig att läsa Webboken så får du en ordentlig och korrekt omstart.

Redigera
Citera flera Citera
1
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara