Avatar billede NielsErikP Mester
16. oktober 2010 - 18:52 Der er 8 kommentarer og
1 løsning

HTML... Centrering af billedet...???

Hej...

Har prøvet "display:block; text-align:center" og det virkede fint, men jeg ville have tekst til at stå på samme linje som billedet evt. flere linjer(på venstre side). Det lykkes også og få teksten placeret rigtig, men der opstod et andet problem.. nemlig det at billedet ikke ville centrerer.

Her er HTML'en  :

<html>
<head>
      <title>Tekst på sammen linje som billedet..!! </title>
</head>
<body>
    <table>
        <tr>
        <td> <div style="float:left;font-size:20;"> <br /> <br /> <br />
                   

        <ul>
                <li> <a href="side1.html"> Personlige interesser. </a> <br/> </li>
                <li> <a href="side2.html"> Galleri. </a> </div> </li> 
                    <div> <img style="float:left;display:block;text-align:center;" width="200px" height="200px" ";margin-left:auto;margin-right:auto;"
                                src="C:\users\starman\pictures\Bamse.jpg" alt ="Starman Bamsen"; />
                    </div>                

        </ul> </td>
       
        </tr>
    </table>   

</body>
</html>


Håber der nogle med lidt lyst til at hjælpe.

På forhånd tak..!!
16. oktober 2010 - 19:18 #1
Jeg lavede den foelgende mini-hjemmeside med din kode, indsatte en doctype og en manglende </div> og indsatte et billed : http://christianjorgensen.be/niels.php .  Paa min Internet Explorer vises billedet til hoejre for de to links, paa min FireFox vises billedet nedenunder de to links.  Beskriv hvordan du vil have det til at se ud, saa kan jeg (og andre maaske) proeve.
Avatar billede NielsErikP Mester
16. oktober 2010 - 22:36 #2
Hej... Christian_Belgien

Jeg tjekkede den mini hjemmeside som du har et link til i din kommentar... Og sådan det ser ud i min IE 8, dog med større fonts i linkene.
Og det er ganske sådan jeg ville have det til at være, linksene på samme sted, dog bare med "Billedet" centret til midten af siden. Ja øverst skal der være ..:
Sort bagrund og over skrift centret--->
<h1>Velkommen til min hjemmeside</h1> i "italic og grøn/blå"
Linksene "Personlig interesser Og Galleri + Andre" i venstre  side af skærmen. Dog med det billed centret.

Håber du forstår, hvad der er hensigten, altså som min kode viser det , dog bare med det billed centret og det er samtidigt vigtigt at de 2 links bliver ved med at være på linje med billedet.
Avatar billede NielsErikP Mester
17. oktober 2010 - 12:50 #3
Hej...

Nu har jeg prøvet at arbejde med det, følgende HTML :

----------------------------------------------------------------
<html>
<head>
      <title>Tekst på sammen linje som billedet..Og billede centreret..!! </title>
</head>
<body>
   
    <div style="float:left;font-size:22"> <br /> <br /> <br />            <br />
                         
        <ul>
    <li> <a href="side1.html"> Personlige interesser. </a> <br/> </li>
    <li> <a href="side2.html"> Galleri. </a> </div></li> 
                   
    <div>  <img style="display:block;text-align:center" width="200px" height="200px"        src="C:\users\starman\pictures\Unge dage\img016.jpg" alt ="Niels Erik Pedersen"; /> </div>       
    </ul>
       
</body>
</html>

----------------------------------------------------------------
Gør at teksten(linksene) godt nok er på venstre side og på samme linje som billedet. Men billedet kommer til at ligge på den højre halvdel af skærmen. Altså ikke helt centreret.

Gør man følgende istedet :

---------------------------------------------------------------

<html>
<head>
      <title>Tekst på sammen linje som billedet..Og billede    centreret..!! </title>
</head>
<body>


<div>  <img style="display:block;text-align:center" width="200px" height="200px"                  src="C:\users\starman\pictures\Unge dage\img016.jpg" alt ="Niels Erik Pedersen"; />


<div style="float:left;font-size:22"> <br /> <br /> <br />
                         
        <ul>
    <li> <a href="side1.html"> Personlige              interesser.</a>      <br/> </li>
    <li> <a href="side2.html"> Galleri. </a> </div></li> 
    </div>       
    </ul>
       
</body>
</html>

--------------------------------------------------------------

Så bliver billedet centreret, men så kommer Linjerne(linksene) godt nok til at ligge til venstre, men i en linje under billedet. Altså ikke på samme linje.

Håber der er en "Hardcore", som er point hungrende eller bare har lyst til at give lidt hjælp til en nybegynder.

På forhånd tak..!!
17. oktober 2010 - 22:27 #4
Jeg er bange for at jeg ikke er hardcore nok til at gennemskue det.
Avatar billede NielsErikP Mester
18. oktober 2010 - 10:35 #5
Hej...
Nej det er da ærlig snak.. tak for det du forsøgte ar hjælpe med.
Avatar billede Stickano Nybegynder
20. oktober 2010 - 14:41 #6
Du kunne gøre det i en <table>?
Kunne sikkert også laves i en div, men jeg er mere en table kinda guy o.O Tjekkede lige den mini site som der er en der har postet.
Jeg ville gøre det sådan her:

<table cellpadding="3" cellspacing="0" align="CENTER/LEFT?">
<tr>
  <td align="left" valign="top">
    DINE LINKS <--
  </td>
  <td align="left" valign="top">
    DIT BILLEDE <--
  </td>
</tr>
</table>
Avatar billede NielsErikP Mester
21. oktober 2010 - 18:58 #7
Hej...
Tak for dit indlæg, nu har jeg prøvet at lege lidt.
Først med nogle DIV's og så med dit eksemple på TABLE's..
Er gået som følger...:

<html>
<head>
      <title>Min title </title>
</head>
<body  bgcolor="#87ceeb" alink="#ff00ff" vlink="#008000">
      <h1 style="text-align:center;color:#008000" >
      <b><i>Velkommen til min Hjemmeside.</i></b> </h1>
    <hr/>
    <br/> <br/>
    <div style="width:1200px" >
        <div style="width:595px;font-size:20px;float:left" >
    <br/> <br/> <br/> <br/> 
    <ul>
        Mine Links
    </ul>
    </div>
        <div style="width:480;font-size:20px;color:#008000">
    <br/>
          <p>Email me </p>
    </div>
       
       
    <div style="clear:both" > </div>
    </div>
</body>
</html>
----------------------------------------------------------------


Og så eksemplet med tables...:

<html>
<head>
      <title>Min title </title>
</head>
<body  bgcolor="#87ceeb" alink="#ff00ff" vlink="#008000">
      <h1 style="text-align:center;color:#008000" >
      <b><i>Velkommen til min Hjemmeside.</i></b> </h1>
      <hr/>
      <br/> <br/>

    <table border="5" cellpadding="5" cellspacing="0"
        align="left" style="font-size:20px">
    <tr>
    <td align="left" valign="bottom">
      <ul > <br/> <br/> <br/> <br/> <br/>
        <li>

                  Mine Links
            </li>
    </ul> </td>
    <td> &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
            &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
            &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
            &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
            &nbsp &nbsp &nbsp &nbsp &nbsp       
    </td>
    <td align="left" valign="top">
             
                  Mit Billed       
    </td>
    </tr>
    </table>
           
           
</body>
</html>

----------------------------------------------------------------

Men problemet er at, jeg ikke er sikker på det skal gøres på nogen af måderne, for når browser vinduet "maksimeres" fungerer begge efter hensigten, men når Browser vinduet sættes til "lille" størrelse altså "gendan fra maksimer", så er billedet helt ude i højre side af browser vinduet og overskriften er godt nok centreret, men det skulle billedet jo også gerne være.

Er der nogen der har en løsning til problemet.

På forhånd tak..!!
24. oktober 2010 - 08:15 #8
Der var aabenbart ingen der kunne komme med en loesning paa problemet.  Forventer du flere indlaeg paa denne traad?  Erfaringen viser at det er sjaeldent med spoergsmaal der er over en uge gammel og derfor 'dukket under horisonten' og hvor der ikke har vaeret friske indlaeg i adskillige dage.  Jeg vil foreslaa at du lukker traaden (selv opretterr et svar og acceptere det) og saa, hvis det er relevant, opretter et nyt spoergsmaal hvor du presenterer problemet paa en frisk.  Saa faar du ny opmaerksomhed, og saa staar dette spoergsmaal ikke laengere som aabent i min liste af indlaeg.
Avatar billede NielsErikP Mester
24. oktober 2010 - 10:07 #9
hej..
Ja.. det kan du jo nok have ret i...!!!
så lukker vi det, sådan at det ikke står åbent hos dig da.
Avatar billede 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.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

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