Avatar billede olzen Nybegynder
16. maj 2005 - 21:54 Der er 39 kommentarer og
1 løsning

Tekst vil ikke stå i midten..

Hejsa..

Jeg har et problem med at teksten i min menu ikke vil stå align=middel.. Teksten står i toppen lige meget hvad jeg gør.. Jeg har forsøgt mig med align og jeg syntes også alt CSS som skulle kunne gøre det.. Margin virker f.eks. heller ikke.. Håber der er nogen der kan se hvordan jeg kan få teksten til at står i midten..

Mit CSS ser sådan her ud:
--------------------------------------
.leftnav {
  font-family: Tahoma;
  font-size: 11px;
  color: #000000;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #f7f7f7;
  display: block;
      background-attachment: fixed;
    background-image: url(/images/gfx/menu-back.gif);
    background-repeat: no-repeat;
    background-position: left center;
  text-indent: 23px;
  height: 20px;
}
.leftnav a:link {
  font-weight: bold;
  font-family: Tahoma;
  text-decoration: none;
  color: #000000;    /* dark blue */ 
  display: block;
  text-indent: 23px;
  height: 20px;
}
.leftnav a:visited {
  font-weight: bold;
  font-family: Tahoma;
  text-decoration: none;
  color: #000000;    /* dark blue */
  display: block;
  text-indent: 23px;
  height: 20px;
}
.leftnav a:active {
  font-weight: bold;
  font-family: Tahoma;
  text-decoration: none;
  color: #000000;    /* dark blue */
  display: block;
  text-indent: 23px;
  height: 20px;
}
.leftnav a:hover {
  font-weight: bold;
  font-family: Tahoma;
  text-decoration: none;
  color: #FFFFFF;    /* burgundy */
  display: block;
      background-attachment: fixed;
    background-image: url(/images/gfx/menu-back1.gif);
    background-repeat: no-repeat;
    background-position: left center;
  text-indent: 23px;
  height: 20px;
}
--------------------------------------

Mit Html ser sådan her ud:
--------------------------------------
<table width="200" border="0" cellpadding="0" cellspacing="0" class="streg-top1" ID="Table1">
    <tr>
        <td valign="bottom">
        <DIV class="leftnav"><strong><a href="#">produkter</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">konfigurator</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">inspiration</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">designere</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">forhandlere</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">nyhedsbrev</a></strong></div>
      </td>
    </tr>
</table>
--------------------------------------
Avatar billede apo Praktikant
16. maj 2005 - 21:58 #1
Måske sådan?

<table style="width:200; border:0px;" cellpadding="0" cellspacing="0" class="streg-top1" ID="Table1">
    <tr>
        <td style="vertical-align:bottom;">
        <DIV class="leftnav"><strong><a href="#">produkter</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">konfigurator</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">inspiration</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">designere</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">forhandlere</a></strong></div>
        <DIV class="leftnav"><strong><a href="#">nyhedsbrev</a></strong></div>
      </td>
    </tr>
</table>

Apo
Avatar billede roenving Novice
16. maj 2005 - 21:58 #2
Stå i midten, horisontalt eller vertikalt ?-)
Avatar billede apo Praktikant
16. maj 2005 - 22:05 #3
Du skriver: align=middel (Er det sådan du har forsøgt dig med?

I så fald skal du skrive det således: align="middle" - Eller mere korrekt: vertical-align:middle;

Apo
Avatar billede apo Praktikant
16. maj 2005 - 22:06 #4
Eller hvis det er horisontalt du vil have det...

style="text-align:center;"
Avatar billede olzen Nybegynder
16. maj 2005 - 22:10 #5
I kan se menuen her: http://www.web-ss.dk/menu.gif

Så skulle i gerne kunne se hvad jeg mener, den skal stå middle vertikalt.. Og jeg har skrevet middle og ikke middel.. :-)
Avatar billede apo Praktikant
16. maj 2005 - 22:10 #6
Rettelse til mit indlæg 22:05:22 :

I så fald skal du skrive det således: valign="middle" - eller mere korrekt: vertical-align:middle;
Avatar billede olzen Nybegynder
16. maj 2005 - 22:10 #7
Har forsøgt med: <td style="vertical-align:bottom;"> der sker ingenting..
Avatar billede apo Praktikant
16. maj 2005 - 22:12 #8
Så skal du bruge vertical-align:middle;

Pilene er det 'løs' grafik eller er de integreret i baggrunden?
Avatar billede olzen Nybegynder
16. maj 2005 - 22:13 #9
Ved ikke om det kan have noget af gøre med at alle menupunkterne står inde i et td tag..
Avatar billede olzen Nybegynder
16. maj 2005 - 22:13 #10
Det er intergret i baggrunden... det er de to her: background-image: url(/images/gfx/menu-back1.gif);

og background-image: url(/images/gfx/menu-back.gif);
Avatar billede olebole Juniormester
16. maj 2005 - 22:14 #11
<ole>

Som jeg forstår dig, vil du centrere div'enes indhold vertikalt. Der findes ikke en måde at centrere indhold vertikalt i HTML-elementer ... kun i tabel-celler.

/mvh
</bole>
Avatar billede olzen Nybegynder
16. maj 2005 - 22:15 #12
Virker heller ikke med: vertical-align:middle

Man kan slet ikke se forskel på teksten, den flytter sig overhovedet ikke..
Avatar billede roenving Novice
16. maj 2005 - 22:15 #13
-- så alternativerne er at give diverne en padding-top, som giver det ønskede resultat eller at bruge en tabel !-)
Avatar billede olzen Nybegynder
16. maj 2005 - 22:16 #14
olebole... Det vil sige det skal laves i flere td'er

Jeg har forsøgt med postion i CSS også men den flytter bare Block med ned.. Så det går heller ikke.. Det er jo kun teksten den skal flytte..
Avatar billede olzen Nybegynder
16. maj 2005 - 22:17 #15
padding-top - Flytter også block med ned, og hover effekten ser dum ud.. Den vil så ikke tage det hele med..
Avatar billede olebole Juniormester
16. maj 2005 - 22:17 #16
Jeg forstår ikke rigtig, hvorfor du lægger design/grafik som beggrund. Hvorfor ikke lægge det ind i de elementer, hvor det retteligt hører hjemme?
Avatar billede apo Praktikant
16. maj 2005 - 22:17 #17
Ahh... Jeg så din <DIV> som <TD> *LOL*
Avatar billede olzen Nybegynder
16. maj 2005 - 22:20 #18
olebole: Ikke helt med... Hvordan det?
Avatar billede apo Praktikant
16. maj 2005 - 22:22 #19
Jeg tror at olebole mener, at du skal bruge <td> i stedet for <div>:

<table style="width:200; border:0px;" cellpadding="0" cellspacing="0" class="streg-top1" ID="Table1">
    <tr>
        <td class="leftnav"><strong><a href="#">produkter</a></strong></td>
    </tr>
    <tr>
        <td class="leftnav"><strong><a href="#">konfigurator</a></strong></td>
    </tr>
    <tr>
        <td class="leftnav"><strong><a href="#">inspiration</a></strong></td>
    </tr>
    <tr>
        <td class="leftnav"><strong><a href="#">designere</a></strong></td>
    </tr>
    <tr>
        <td class="leftnav"><strong><a href="#">forhandlere</a></strong></td>
    </tr>
    <tr>
        <td class="leftnav"><strong><a href="#">nyhedsbrev</a></strong></td>
    </tr>
</table>

Apo
Avatar billede olzen Nybegynder
16. maj 2005 - 22:23 #20
Hmmm.. Nu har jeg delt det mere op, men teksten står stadig i toppen:

<table width="200" border="0" cellpadding="0" cellspacing="0" class="streg-top1" ID="Table1">
    <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="produktvisning.aspx">produkter</a></strong></div>
      </td>
    </tr>
        <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="konfigurator.aspx">konfigurator</a></strong></div>
      </td>
    </tr>
        <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="inspiration.aspx">inspiration</a></strong></div>
      </td>
    </tr>
        <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="designere.aspx">designere</a></strong></div>
      </td>
    </tr>
        <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="findforhandler.aspx">forhandlere</a></strong></div>
      </td>
    </tr>
        <tr>
        <td valign="middle" style="vertical-align:middle;">
        <DIV class="leftnav"><strong><a href="nyhedsbrev.aspx">nyhedsbrev</a></strong></div>
      </td>
    </tr>
</table>
Avatar billede olzen Nybegynder
16. maj 2005 - 22:26 #21
Så har jeg sat den på td:

<table width="200" border="0" cellpadding="0" cellspacing="0" class="streg-top1" ID="Table1">
    <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="produktvisning.aspx">produkter</a></strong>
      </td>
    </tr>
        <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="konfigurator.aspx">konfigurator</a></strong>
      </td>
    </tr>
        <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="inspiration.aspx">inspiration</a></strong>
      </td>
    </tr>
        <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="designere.aspx">designere</a></strong>
      </td>
    </tr>
        <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="findforhandler.aspx">forhandlere</a></strong>
      </td>
    </tr>
        <tr>
        <td valign="middle" class="leftnav">
        <strong><a href="nyhedsbrev.aspx">nyhedsbrev</a></strong>
      </td>
    </tr>
</table>

Men virker stadig ikke..
Avatar billede roenving Novice
16. maj 2005 - 22:26 #22
<table width="200" border="0" cellpadding="0" cellspacing="0" class="streg-top1" id="Table1">
    <tr>
        <td class="leftnav"><a href="produktvisning.aspx">produkter</a></td>
    </tr>
        <tr>
        <td class="leftnav"><a href="konfigurator.aspx">konfigurator</a></td>
    </tr>
        <tr>
        <td class="leftnav"><a href="inspiration.aspx">inspiration</a></td>
    </tr>
        <tr>
        <td class="leftnav"><a href="designere.aspx">designere</a></td>
    </tr>
        <tr>
        <td class="leftnav"><a href="findforhandler.aspx">forhandlere</a></td>
    </tr>
        <tr>
        <td class="leftnav"><a href="nyhedsbrev.aspx">nyhedsbrev</a></td>
    </tr>
</table>

-- og jeg fjernede også de (vel !-) overflødige strong-tags !-)
Avatar billede olzen Nybegynder
16. maj 2005 - 22:28 #23
Har sat den ind roenving, men virker stadig ikke. og ja der var jo overflødige..
Avatar billede olzen Nybegynder
16. maj 2005 - 22:31 #24
Kan det havde noget at gøre med at der er sat height på i CSS
Avatar billede roenving Novice
16. maj 2005 - 22:31 #25
Fjern display:block; fra .leftnav-definitionen ...
Avatar billede olzen Nybegynder
16. maj 2005 - 22:35 #26
Når jeg fjerner block: http://www.web-ss.dk/menu1.gif

Så ser det da helt galt ud..
Avatar billede roenving Novice
16. maj 2005 - 22:38 #27
-- så er det på .leftnav a{} der skal display:block; !-)
Avatar billede olzen Nybegynder
16. maj 2005 - 22:40 #28
Står stadig i toppen..
Avatar billede olzen Nybegynder
16. maj 2005 - 22:42 #29
Hvis jeg fjerner:    height: 20px; i CSS og sætter den til 20 på <td> så bliver den middle
Avatar billede olzen Nybegynder
16. maj 2005 - 22:43 #30
Men så går hover ikke helt med op: http://www.web-ss.dk/menu2.gif
Avatar billede olzen Nybegynder
16. maj 2005 - 22:44 #31
Og så jeg så height på i CSS på hover kun, så når man køre over den så laver den menupunktet større.. så det virker heller ikke
Avatar billede olzen Nybegynder
16. maj 2005 - 22:48 #32
Og så jeg så height = Og sætter jeg så height
Avatar billede roenving Novice
16. maj 2005 - 22:51 #33
Prøv med attilføje line-height !-)

  height: 20px;
  line-height:20px;
}
Avatar billede olzen Nybegynder
16. maj 2005 - 22:53 #34
roenving du er hermed udnævnt til dagens mand i skysovs.. :-) Der er godt nok ikke så meget tilbage af dagen, men du har lige reddet min.. Det virker perfekt nu.. MANGE TAK!!! smid et svar, så er pointene dine. :-)
Avatar billede roenving Novice
16. maj 2005 - 23:01 #35
Velbekomme '-)

-- men skal jeg have point skal det vel være på en deler med de andre, som har prøvet at løse problemet !-)

-- og så synes jeg, at 150 point er alt for mange at uddele, så du bør også selv være med i deleren !o]

-- forøvrigt fik jeg mistanken på et tidspunkt, hvor du selv havde prøvet noget, men ville ikke foreslå det, før jeg selv havde kigget på det, så alene af den grund er det rimeligt ...
Avatar billede roenving Novice
16. maj 2005 - 23:01 #36
;O)
Avatar billede olebole Juniormester
16. maj 2005 - 23:12 #37
Jeg var lidt fraværende, da løsningen endelig begyndte at køre, så jeg springer over  :)
Avatar billede olzen Nybegynder
16. maj 2005 - 23:13 #38
Lyder fornuftigt.. i andre kan lige ligge et svar også.. Og tak for hjælpen til alle.. Giver point imorgen, når i har svaret.. Lukker nemlig for idag..
Avatar billede apo Praktikant
17. maj 2005 - 18:19 #39
Jeg var nød til at afbryde midt i det hele, så behold du pointene, Roenving :-)

Apo
Avatar billede roenving Novice
18. maj 2005 - 00:22 #40
Tak for point ;~}

-- hvadfor beholdt du ikke selv nogen ?-)
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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