CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

torbenclausen Nybegynder

12. november 2005 - 19:41 Der er 18 kommentarer

Billede og tekst i tabel uden margin

Hej
Har en tabel hvori jeg skal have et billede placeret i toppen til højre og tekste under billedet ligeledes med højre margin.
Jeg har prøvet og prøvet alle mulige måder men det vil ikke lykkes. Somom tabellen har en margin i toppen og i højre side. Bruger nu følgende kode:

Min tabel:
<table width="0" border="0" cellspacing="0" cellpadding="0"">
<tr>
<td id="profile">

<div id="profilefactsinner">
<div id="profilefacts">
<img id="imageprofile" src="images/billed.jpg"><br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst</div>
</div>
</td>

Min css:
#profile {
background-color:#66CC99;
width:150px;
height:300px;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;

}

#imageprofile {
border:1px solid #000000;
position:relative;
top:0px;
}

#profilefactsinner {
width:150px;
height:348px;
position:relative;

}

#profilefacts {
position:absolute;
top:0px;
right:0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
font-weight:normal;
text-align:right;

}

Håber i forstår spørgsmålet? Vil være lækkert at få det løst, har drillet længe.

//TC

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 19:42 #1

Rettelse

#profilefactsinner {
width:150px;
height:300px;
position:relative;

}

Synes godt om

apo Praktikant

12. november 2005 - 20:10 #2

Du bruger selvfølgelig en fuld DOCTYPE-defintion, ikke?

F.eks.:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Ellers disabler du det meste CSS i IE.

Prøv at tilføje:

html,body {margin:0; padding:0; height:100%;}

til din CSS, og se om det hjælper noget.

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 20:21 #3

Jo bruger fuld docktype-definition...

Det andet gør ingen forskel...

Kan godt fx sætte fx

#profilefacts {
position:absolute;
top:0px;
right:20px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
font-weight:normal;
text-align:right;
}

Så lægger billedet sig 20px fra toppen, men det vil ikke lægge sig med top:0px;

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 20:21 #4

Sorry ikke right:20px men top:20px

Synes godt om

apo Praktikant

12. november 2005 - 20:28 #5

har du prøvet med padding:0; ?

Synes godt om

apo Praktikant

12. november 2005 - 20:33 #6

Det er lidt svært for mig, at få et overblik over det, du er i gang med. Jeg kan ikke følge hvorfor du er ude i position:absolute;

Har du evt. et link?

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 20:37 #7

Nej har ik lige mulighed for upload lige nu, men position absolute er fordi jeg har lagt #profilefacts ind i #profilefactsinner som har position:relative;
En måde jeg før har løst problemer med placeringer af div.

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 20:40 #8

Altså er det bare noget tekst og et billede som er lagt ind i en <div> som skal placeres øverst til højre i tabellen... Men det er somom tabellen har en margin jeg ikke kan fjerne!

Synes godt om

apo Praktikant

12. november 2005 - 20:43 #9

Ud fra den kode du har vist mig, ser det fint ud når jeg kører den i min editor. Billedet befinder sig i øverste højre hjørne (uden luft mellem billede og kanten) og teksten befinder sig neden under - højrejusteret.

Der må være noget andet galt så?

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 20:47 #10

Ser også fint ud i min editor. Men når du tager et preview i en browser er den gal?!?

Synes godt om

apo Praktikant

12. november 2005 - 20:54 #11

Nu har jeg testet det i både IE 6.0 og FF - Det ser ud som, jeg kan forstå du vil have at det skal se ud (Billedet er helt ude ved kanten af det grønne felt både i top og right).

Synes godt om

torbenclausen Nybegynder

12. november 2005 - 21:03 #12

Hmm det kan jeg ikke forstå, er der ingen grøn kant i toppen af din tabel? Kan godt få right:0px; til at funge.
Vil du poste koden du har brugt?

Synes godt om

apo Praktikant

12. november 2005 - 22:01 #13

Ingen grøn kant. Den sorte kant på billedet ligger helt ud til kanten :-)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nyt dokument</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<style type="text/css">
#profile {
background-color:#66CC99;
width:150px;
height:300px;
padding:0 0 0 0;
margin:0 0 0 0;
}
#imageprofile {
border:1px solid #000000;
position:relative;
top:0;
}
#profilefactsinner {
width:150px;
height:300px;
position:relative;
}
#profilefacts {
position:absolute;
top:0;
right:0;
font-family:verdana, arial, helvetica, sans-serif;
font-size:9px;
font-weight:normal;
text-align:right;
}
</style>
</head>

<body>
<table width="0" border="0" cellspacing="0" cellpadding="0"">
<tr>
<td id="profile">

<div id="profilefactsinner">
<div id="profilefacts">
<img id="imageprofile" src="images/billed.jpg" style="width:100px; height:100px;"><br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst</div>
</div>
</td>
</tr>
</table>

</body>
</html>

Synes godt om

apo Praktikant

13. november 2005 - 17:48 #14

Er du kommet videre?

Synes godt om

torbenclausen Nybegynder

15. november 2005 - 16:44 #15

Hmm nej og undskyld jeg sådan forsvandt! Penge der skulle tjenes;o)

Anyway, troede egentligt ikke det gjorde noget at lægge en tabel i en tabel mht layout. Det er egentligt bare en lille del af koden fra siden som er:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TITLE</title>
<link rel="stylesheet" type="text/css" href="styles/style.css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<br>

<table width="0" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td id="big">

<tr>
<td id="topmenu">
<div id="top-inner">
<ul id="menulist">
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
</ul>
</div>
<table width="0" border="0" cellspacing="0" cellpadding="0"">
<tr>
<td id="profile">
<div id="profilefactsinner">
<div id="profilefacts">
<img id="imageprofile" src="images/billed.jpg" style="width:100px; height:100px;"><br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst<br>
Tekst</div>
</div></div>
</td>
<td>
<table width="0" border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="topimage">3</td>
</tr>
<tr>
<td id="main"><iframe src="main.htm" marginwidht=0 marginheight=0 hspace=0 vspace=0 frameborder="0" scrolling="NO" width="540" height="270"></iframe></td>
</tr>
<tr>
<td id="bottom"> </td>
</tr>
</table>

</body>
</html>

Og det vil godt virker hvis man laver det i sin helt egen tabel, men ikke "samlet". Håber du forstår?

Synes godt om

apo Praktikant

17. november 2005 - 18:32 #16

Der sker ikke noget ved, at lægge en tabel i en tabel; Dog er det uhensigtsmæssigt, at neste mange tabeller ind i hinanden (Som du har gjort), hvis det ikke er strengt nødvendigt.

Men hvorfor er det nødvendigt for dig, at lægge en tabel i en tabel, i det viste tilfælde? Hvis det er fordi du i den ene tabel har en enkelt kolonne og har brug for at opdele en celle i flere, kan du benytte dig af colspan="x" (Hvor x er antallet af kolonner) - Som vist herunder:

<table>
<tr>
<td colspan="2" style="width:500px;"> </td>
</tr>
<tr>
<td style="width:250px;"> </td>
<td style="width:250px;"> </td>
</tr>
</table>

Derudover er det vigtigt, at du husker at afslutte elementerne i din tabel; Du har f.eks. glemt en </tr> i følgende:

<table width="0" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td id="big">


<tr>
<td id="topmenu">
<div id="top-inner">
<ul id="menulist">
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">Menu</a></li>
</ul>
</div>

<table width="0" border="0" cellspacing="0" cellpadding="0"">
<tr>

Synes godt om

apo Praktikant

19. november 2005 - 15:33 #17

Er du ude, at tjene flere penge? ;-)

Synes godt om

torbenclausen Nybegynder

20. november 2005 - 18:34 #18

He he ja, eller har ihvertfald lige været det;o)

Der mangler ikke en </tr> den er nederst i dokumentet, "big" er lisom bare den der indeholder alt det andet, så den afsluttes helt til sidst.

Kendte ikke til colspan, men skal både have rækker og kolonner i dokumentet så det rækker vist ikke til dette, men tak for tippet!

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML	2	30/10/202409:37	30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS

15:59

Test: Den snusfornuftige Volkswagen ID.3 blevet til lidt af el-bisse

15:15

Vil købe tele-løsninger til det offentlige for 370 millioner kroner

14:30

Nørgaard: Det er de neuro-divergente originalers tid

22/11

Sker helt åbenlyst: Ansatte i den kinesiske stat sælger borgernes personlige data på hemmelige internet-fora

22/11

Efterspørgslen på AI-regnekraft er enorm - og det smitter af på priserne: "Vi kan sælge næsten alt, hvad vi får ind"

22/11

Derfor bliver den amerikanske tvangs-opdeling af Google nok ikke til noget

22/11

Nyt værtøj fra Microsoft: Snart kan du reparere nedbrudte Windows-enheder på distancen

22/11

Vi har fundet 10 ledige it-stillinger, som du kan søge netop nu

22/11

Politiet skriver kontrakt på 75 millioner kroner med dansk it-firma: Medarbejdere skal flytte ind hos politiet

22/11

Kombit gør klar til at købe it-konsulenter for 140 millioner kroner - her er planen

22/11

Droner i krig - sådan anvendes de mest effektivt på slagmarken

Vis flere artikler

IT-JOB

Semler Gruppen

Change Manager til Semler Gruppen

Danske Commodities A/S

Data technician trainee

IST ApS

Head of Cloud Services

Sydbank

Senior Data Specialist til Data & Business Enablement

Capgemini Danmark A/S

Salesforce Senior Technical Consultant

Vis flere jobs

Seneste spørgsmål Seneste aktivitet

6 min siden	vise billeder i kartotek med store ikoner inklusive optagelsesdato Af Malm i Billedbehandling
29 min siden	Adobe Elements 2019, Organizer Crasher Af mort1 i Billedbehandling
I går 20:49	pop up black friday Af Malm i Virus
I går 18:31	Hvor finder jeg en netværksdriver? Af jcr18 i Wifi
I går 16:49	Identificér og hent del af tekststreng Af TheLibrarian i Excel