/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Bjælke med afrundede hjørner
Fra : Jesper Stocholm


Dato : 25-07-03 12:26

Jeg skal have lavet en bjælke med runde højre og venstre kanter. Det
troede jeg egentlig ikke var så svært, men jeg kan ikke få det til at
virke korrekt - specifikt er det kanten på bjælken, som jeg ikke kan
fjerne.

Min kode er denne:


<table style="width:100%;padding:0px;border-spacing:0px;border-collapse:collapse;border-width:0px;">
   <tr style="background:#d6dfef;">
       <td style="width:14px;text-align:left;">
           <img src="left3.png" height="25" width="14" alt=""/>
       </td>
       <td></td>
       <td style="text-align:right;width:14px;">
           <img src="right3.png" height="25" width="14" alt=""/>
       </td>
   </tr>
</table>

Et eksempel kan ses på http://stocholm.dk/test/css/corners.html

Hvad er det jeg mangler?


--
Jesper Stocholm - http://stocholm.dk
if you are competing with the darknet, you must compete on the darknet's
own terms: that is convenience and low cost rather than additional
security. ( http://crypto.stanford.edu/DRM2002/darknet5.doc )

 
 
Henrik Stidsen (25-07-2003)
Kommentar
Fra : Henrik Stidsen


Dato : 25-07-03 13:59

Jesper Stocholm <jespers@stocholm.invalid> wrote in
news:Xns93C38854530C1stocholmdk@130.226.1.34

> <tr style="background:#d6dfef;">

Prøv at fjerne baggrundsfarven på denne.

--
..: Henrik Stidsen - http://hs235.dk/ - http://hs235.dk/blog/ ::...
Nerd is a word only used by those who can’t pronounce ’Intellectual’.
- http://query.dk/permlink.php?link=1058129898

Jesper Stocholm (25-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 25-07-03 15:31

Henrik Stidsen wrote :

Hej Henrik,

> Jesper Stocholm <jespers@stocholm.invalid> wrote in
> news:Xns93C38854530C1stocholmdk@130.226.1.34
>
>> <tr style="background:#d6dfef;">
>
> Prøv at fjerne baggrundsfarven på denne.

Jeps - det havde jeg sådan set prøvet, men det giver "blot" et nyt
problem - nemlig en linie imellem billedet og det midterste tabelelement.
Jeg har på fornemmelsen at jeg ikke får fjernet kanterne på min tabel
ordentligt - men selvom jeg har kigget grundigt på "box modellen" på
w3.org, så kan jeg ikke hitte ud af hvordan jeg gør det korrekt.

http://stocholm.dk/test/css/corners.html

--
Jesper Stocholm - http://stocholm.dk - http://asp-faq.dk
Skriv venligst under det du svarer på og skær det overflødige væk.
Se evt hvorfor på http://www.usenet.dk/netikette/citatteknik.html
Svar venligt til gruppen og ikke til mig privat !

Henrik Stidsen (25-07-2003)
Kommentar
Fra : Henrik Stidsen


Dato : 25-07-03 20:34

Jesper Stocholm <jespers@stocholm.invalid> wrote in
news:Xns93C3A7D016601stocholmdk@130.226.1.34

> Jeps - det havde jeg sådan set prøvet, men det giver "blot" et
> nyt problem - nemlig en linie imellem billedet og det midterste
> tabelelement. Jeg har på fornemmelsen at jeg ikke får fjernet
> kanterne på min tabel ordentligt - men selvom jeg har kigget
> grundigt på "box modellen" på w3.org, så kan jeg ikke hitte ud
> af hvordan jeg gør det korrekt.
>
> http://stocholm.dk/test/css/corners.html

Prøv at tilføje cellpadding="0" til din <table>, det virker i hvert
fald her.

--
..: Henrik Stidsen - http://hs235.dk/ - http://hs235.dk/blog/ ::...
Nerd is a word only used by those who can’t pronounce ’Intellectual’.
- http://query.dk/permlink.php?link=1058129898

Jesper Stocholm (26-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 26-07-03 10:18

Henrik Stidsen wrote :

> Jesper Stocholm <jespers@stocholm.invalid> wrote in
>
>> Jeps - det havde jeg sådan set prøvet, men det giver "blot" et
>> nyt problem - nemlig en linie imellem billedet og det midterste
>> tabelelement. Jeg har på fornemmelsen at jeg ikke får fjernet
>> kanterne på min tabel ordentligt - men selvom jeg har kigget
>> grundigt på "box modellen" på w3.org, så kan jeg ikke hitte ud
>> af hvordan jeg gør det korrekt.
>>
>> http://stocholm.dk/test/css/corners.html
>
> Prøv at tilføje cellpadding="0" til din <table>, det virker i hvert
> fald her.

Aah ... det virker søreme. Grunden til at jeg ikke anvendte den var jeg
jeg ikke troede, at min HTML så kunne gå som XHtml strict (hvilket jeg nu
kan se ikke er tilfældet).

Findes der ikke en CSS-ækvivalent til cellspacing-attributten?



--
Jesper Stocholm - http://stocholm.dk
The Web submission form is the preferred procedure. However, if you don't
have access to the Internet you may send your submission by e-mail.
(Nyhedsbrev fra 9th Conference on Reliable Software Technologies)

Jesper Stocholm (26-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 26-07-03 13:17

Henrik Stidsen wrote :

> Jesper Stocholm <jespers@stocholm.invalid> wrote in
> news:Xns93C3A7D016601stocholmdk@130.226.1.34
>
>> Jeps - det havde jeg sådan set prøvet, men det giver "blot" et
>> nyt problem - nemlig en linie imellem billedet og det midterste
>> tabelelement. Jeg har på fornemmelsen at jeg ikke får fjernet
>> kanterne på min tabel ordentligt - men selvom jeg har kigget
>> grundigt på "box modellen" på w3.org, så kan jeg ikke hitte ud
>> af hvordan jeg gør det korrekt.
>>
>> http://stocholm.dk/test/css/corners.html
>
> Prøv at tilføje cellpadding="0" til din <table>, det virker i hvert
> fald her.

Nu begynder det i det mindste at ligne noget. Jeg har dog problemer med
at få det til at se ordentligt ud i Mozilla 1.4 . Jeg har trimmet koden
så meget jeg kan, men der bliver ved at være en kant under selve bjælken,
som jeg ikke kan få fjernet.

Nogle gode idéer (se link ovenfor)?



--
Jesper Stocholm - http://stocholm.dk
** Vil det sige, at ham Lars er et stort brød på 15 år ? **
Svar venligst til gruppen og ikke til mig privat !
Skriv under det du svarer på - www.usenet.dk/netikette/citatteknik.html

Stig Nygaard (26-07-2003)
Kommentar
Fra : Stig Nygaard


Dato : 26-07-03 13:37

Hej Jesper


Jesper Stocholm wrote:
>>>http://stocholm.dk/test/css/corners.html
>>Prøv at tilføje cellpadding="0" til din <table>, det virker i hvert
>>fald her.
> Nu begynder det i det mindste at ligne noget. Jeg har dog problemer med
> at få det til at se ordentligt ud i Mozilla 1.4 . Jeg har trimmet koden
> så meget jeg kan, men der bliver ved at være en kant under selve bjælken,
> som jeg ikke kan få fjernet.

Det er faktisk korrekt opførsel af Mozilla ifølge standarderne og
skyldes at IMG er et inline element. En af løsningerne er at gøre dine
billeder til block elementer (style="display:block"). For mere
information se:

http://devedge.netscape.com/viewsource/2002/img-table/


--
Mvh. Stig
stig[at]rockland[dot]dk
http://www.rockland.dk/
* Bedre (D)HTML ?! --> http://www.rockland.dk/stig/upghtml.html *


Jesper Stocholm (26-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 26-07-03 14:37

Stig Nygaard wrote :

> Hej Jesper
>
>
> Jesper Stocholm wrote:
>>>>http://stocholm.dk/test/css/corners.html
>>>Prøv at tilføje cellpadding="0" til din <table>, det virker i hvert
>>>fald her.
>> Nu begynder det i det mindste at ligne noget. Jeg har dog problemer
>> med at få det til at se ordentligt ud i Mozilla 1.4 . Jeg har trimmet
>> koden så meget jeg kan, men der bliver ved at være en kant under
>> selve bjælken, som jeg ikke kan få fjernet.
>
> Det er faktisk korrekt opførsel af Mozilla ifølge standarderne og
> skyldes at IMG er et inline element. En af løsningerne er at gøre dine
> billeder til block elementer (style="display:block"). For mere
> information se:
>
> http://devedge.netscape.com/viewsource/2002/img-table/

Mange tak :) Vil det i det hele taget hjælpe mig hvis jeg smider min
tabel-dims ud og laver det hele som CSS2 med absolute positioning? Når
jeg har fået det til at se ordentligt ud skal selve tabellen alligevel
puttes i en div, der placeres absolut.



--
Jesper Stocholm - http://stocholm.dk
www.asp-faq.dk : FAQ for dk.edb.internet.webdesign.serverside.asp
www.usenet.dk/netikette/citatteknik.html : Skriv under det du svarer på
Svar til gruppen og ikke til mig privat !

Henrik Stidsen (26-07-2003)
Kommentar
Fra : Henrik Stidsen


Dato : 26-07-03 15:10

Jesper Stocholm <jespers@stocholm.invalid> wrote in
news:Xns93C49E9F37B9Dstocholmdk@130.226.1.34

> Mange tak :) Vil det i det hele taget hjælpe mig hvis jeg smider
> min tabel-dims ud og laver det hele som CSS2 med absolute
> positioning? Når jeg har fået det til at se ordentligt ud skal
> selve tabellen alligevel puttes i en div, der placeres absolut.

Så ville jeg nok smide tabellen helt ud og kun bruge <div> :)

--
..: Henrik Stidsen - http://hs235.dk/ - http://hs235.dk/blog/ ::...
Nerd is a word only used by those who can’t pronounce ’Intellectual’.
- http://query.dk/permlink.php?link=1058129898

Jesper Stocholm (27-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 27-07-03 16:03

Henrik Stidsen wrote :

> Jesper Stocholm <jespers@stocholm.invalid> wrote in
> news:Xns93C49E9F37B9Dstocholmdk@130.226.1.34
>
>> Mange tak :) Vil det i det hele taget hjælpe mig hvis jeg smider
>> min tabel-dims ud og laver det hele som CSS2 med absolute
>> positioning? Når jeg har fået det til at se ordentligt ud skal
>> selve tabellen alligevel puttes i en div, der placeres absolut.
>
> Så ville jeg nok smide tabellen helt ud og kun bruge <div> :)

Det har jeg så nu gjort - det var faktisk ikke så svært som jeg egentlig
havde troet.

Jeg har dog problemer med at aligne mine data, billeder etc inde i mine
DIV-elementer.

Et eksempel er som disse to DIVs

<div style="position:absolute;top:100px;left:50%;
   margin-left:-376px;background:#ff0000;height:25px;width:440px;">
   <form>
       Email:<input class="text" type="text" size="20"/>
       Password:<input class="text" type="text" size="20"/>
       <input type="image" src="login3.png"/>
   </form>
</div>

<div style="position:absolute;top:100px;left:50%;margin-
   left:64px;background:#0000FF;height:25px;width:312px;text-
   align:right;">
   Create Profile|Forgot password|About|;
       <a href="dksite.dk">
           <img src="dk.gif" alt="" width="16" height="12"/>
       </a>
</div>

De danner det indre af min bjælke, der er centreret på siden.

Som det kan ses på http://www.stocholm.dk/test/css/corners.html,
hopper indholdet af delene. Jeg har prøvet at indsætte vertical-
align:middle; i de to DIVs, men det giver intet resultat. Jeg prøvede
også - som det blev refereret i artiklen - at sætte en display:block på
mine billeder, men det ødelagde designet helt.

Har jeg malet mig op i et hjørne ... igen?

I øvrigt kan jeg se at at Opera 7.11 presser mine INPUT TEXT-bokse
sammen, så de nærmest bliver et par pixels høje. Hvad skyldes det?
Mozilla og IE6 viser begge boksene som det var meningen.



--
Jesper Stocholm - http://stocholm.dk
www.asp-faq.dk : FAQ for dk.edb.internet.webdesign.serverside.asp
www.usenet.dk/netikette/citatteknik.html : Skriv under det du svarer på
Svar til gruppen og ikke til mig privat !

Henrik Stidsen (27-07-2003)
Kommentar
Fra : Henrik Stidsen


Dato : 27-07-03 18:32

Jesper Stocholm <jespers@stocholm.invalid> wrote in
news:Xns93C5AD3AA6748stocholmdk@130.226.1.34

> Som det kan ses på http://www.stocholm.dk/test/css/corners.html,
> så hopper indholdet af delene. Jeg har prøvet at indsætte
> vertical- align:middle; i de to DIVs, men det giver intet
> resultat. Jeg prøvede også - som det blev refereret i artiklen -
> at sætte en display:block på mine billeder, men det ødelagde
> designet helt.
>
> Har jeg malet mig op i et hjørne ... igen?
>
> I øvrigt kan jeg se at at Opera 7.11 presser mine INPUT
> TEXT-bokse sammen, så de nærmest bliver et par pixels høje. Hvad
> skyldes det? Mozilla og IE6 viser begge boksene som det var
> meningen.

Her kan jeg desværre ikke hjælpe dig mere.

--
..: Henrik Stidsen - http://hs235.dk/ - http://hs235.dk/blog/ ::...
Nerd is a word only used by those who can’t pronounce ’Intellectual’.
- http://query.dk/permlink.php?link=1058129898

Jesper Stocholm (27-07-2003)
Kommentar
Fra : Jesper Stocholm


Dato : 27-07-03 20:08

Henrik Stidsen wrote :

> Jesper Stocholm <jespers@stocholm.invalid> wrote
>
>> Som det kan ses på http://www.stocholm.dk/test/css/corners.html,
>> så hopper indholdet af delene. Jeg har prøvet at indsætte
>> vertical- align:middle; i de to DIVs, men det giver intet
>> resultat. Jeg prøvede også - som det blev refereret i artiklen -
>> at sætte en display:block på mine billeder, men det ødelagde
>> designet helt.
>>
>> Har jeg malet mig op i et hjørne ... igen?
>>
>> I øvrigt kan jeg se at at Opera 7.11 presser mine INPUT
>> TEXT-bokse sammen, så de nærmest bliver et par pixels høje. Hvad
>> skyldes det? Mozilla og IE6 viser begge boksene som det var
>> meningen.
>
> Her kan jeg desværre ikke hjælpe dig mere.

æv ... og jeg der blev så glad for at se, at der var blevet svaret i
tråden.



Jeg tror jeg i morgen forsøger at klippe min bjælke endnu mere i stykker,
så jeg kan putte nogle af billederne i seperate DIVer - det kan være at
det vil hjælpe på mit problem.

Tak for hjælpen indtil nu.

--
Jesper Stocholm - http://stocholm.dk
Fra Kidchen på kids.tv2.dk:
[Miss Mukuba] Og vi skal nu til konkurrencen. Spørgsmålet er
"Hvilken af grisens indvolde indeholder leverpostej?"

Jens Gyldenkærne Cla~ (27-07-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 27-07-03 23:09

Jesper Stocholm skrev:

> Som det kan ses på
> http://www.stocholm.dk/test/css/corners.html, så hopper
> indholdet af delene. Jeg har prøvet at indsætte vertical-
> align:middle; i de to DIVs, men det giver intet resultat.

Prøv følgende ændring i din css:

(under form, input tilføjet)

         form, input {
           /*   display: inline; */
            margin: 0px;
            padding: 0px;
            vertical-align: middle;
         }
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Søg
Reklame
Statistik
Spørgsmål : 177523
Tips : 31968
Nyheder : 719565
Indlæg : 6408674
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste