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

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?

Permalänk
Medlem

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

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>

Permalänk
Medlem

Använd inte tabeller för layout!

Permalänk

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

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

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.

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" />

Visa signatur

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

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>

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.