[CSS] hr met background & repeat-x

Pagina: 1
Acties:

  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
Hi,

Ik heb een probleempje waar ik niet uit kom.
Het lijkt heel simpel en ik weet ook bijna zeker dat dat zo is, maar om een of andere reden....

Ik heb een table die moet gaan dienen voor navigatie,
de table komt in een tr van een andere table te hangen,
aan de linkerkant ' < terug ' en aan de rechterkant ' verder > '
daar tussen in moet de boel worden opgevuld met puntjes, dit moet echter generiek gebeuren want tussen deze ' < terug ' en ' verder > ' moeten eventueel ook nog andere linkjes gehangen kunnen worden.

Aanpak:

1.

In de td komt een background te hangen, de td krijgt een width mee van 100% en dus zal zichzelf altijd opvullen binnen de ruimte die ze heeft...
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<tr>
<td align="center">
<!--navigatie--> 
<table border="1" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="contentredbold" align="left">
<
</td>
<td class="contentredbold" align="left">
terug
</td>
<td class="wizardnavruler" width="100%">
&nbsp;
</td>
td class="contentredbold" align="right">
verder
</td>
<td class="contentredbold" align="right"> 
>
</td>                       
</tr>
</table>                
<!--end of navigatie--> 
</td>
</tr>

In de CSS

.wizardnavruler {
    background-image : url(../images/reddot.gif);
    background-repeat : repeat-x;
}

2.

In de td komt een HR te staan waar een background aan is gekoppeld
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<tr>
<td align="center">
<!--navigatie--> 
<table border="1" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="contentredbold" align="left">
<
</td>
<td class="contentredbold" align="left">
terug
</td>
<td width="100%">
<hr>
</td>
td class="contentredbold" align="right">
verder
</td>
<td class="contentredbold" align="right"> 
>
</td>                       
</tr>
</table>                
<!--end of navigatie--> 
</td>
</tr>

In de CSS

hr {
    background: url(../images/reddot.gif);
    background-repeat : repeat-x;
}

Probleem:

Beide oplossingen werken niet :(
Het pad naar de reddot.gif klopt...

Ik zou graag een voorbeeld online gooien maar die mogelijkheid heb ik ff niet...

Ik hoop dat iemand mijn probleem snapt en ziet wat ik fout doe...

tnx in advance!

Flickr


  • Hangloozz
  • Registratie: Juli 1999
  • Laatst online: 13-07 17:24

Hangloozz

{ @$%&# }

tsk, tsk, slordig gewerkt hoor ;) :
code:
1
2
3
4
</td>
td class="contentredbold" align="right">
verder
</td>

een td beginnend zonder <.
En waarom gebruik je voor de navigatie < ipv < ?

www.jurgroessen.nl


  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
Op donderdag 01 november 2001 17:49 schreef Hangloozz het volgende:
tsk, tsk, slordig gewerkt hoor ;) :

een td beginnend zonder <.

En waarom gebruik je voor de navigatie < ipv < ?
Ik dacht heeeeeel ff 'dat meeeen je niet', maar helaas, foutje gemaakt bij het koppie peesten ;(

de < staat er wel degelijk...

Op je andere vraag... te lui denk ik :)

Flickr


  • Hangloozz
  • Registratie: Juli 1999
  • Laatst online: 13-07 17:24

Hangloozz

{ @$%&# }

even resumeren:
je wilt dus achter de HR een achtergrond van een rood stippen patroon?
Je hebt 2 opties geprobeerd en beide werken niet?

Ik heb ook ff aan het klooien geweest maar ik krijg bij het HR-element zowiezo geen achtergrond; dat lijkt dus niet te kunnen (jouw 2e aanpak zeg maar).

Als ik het doe zoals je in aanpak 1 voorstelt, werkt het wel; een patroon aan de bovenzijde vd cel, net boven de HR.
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Untitled</TITLE>
<style>

.wizardnavruler {
    background-image : url("reddot.gif");
    background-repeat : repeat-x;
}

</style>
</HEAD>
<BODY>
    <TABLE>
        <TR>
            <TD align="center"> <!--navigatie-->
                <TABLE border="1" cellspacing="0" cellpadding="0" width="100%">
                    <TR>
                        <TD class="contentredbold" align="left">    <
                        </TD>
                        <TD class="contentredbold" align="left">    terug
                        </TD>
                        <TD class="wizardnavruler" width="100%"><hr width="300" size="1" noshade>
                        </TD>
                        <TD class="contentredbold" align="right">   verder
                        </TD>
                        <TD class="contentredbold" align="right">   >
                        </TD>
                    </TR>
                </TABLE>    <!--end of navigatie-->
            </TD>
        </TR>
    </TABLE>
</BODY>
</HTML>

zoek de verschillen :?
ik heb eigenlijk alleen die redot.gif tussen " gezet...

www.jurgroessen.nl


  • 2
  • Registratie: November 2000
  • Laatst online: 31-03 13:52

2

Goh ik heb hier een beetje hetzelfde als Hangloozz eerlijk gezegd. Weetje zeker dat al het andere klopt?

Anders moet je proberen de tabel een achtergrondplaatje te geven (en dan alle cellen behalve de 'lege' een bgcolor) ipv de cel zelf.

  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
Hanglooz,

ten eerste tnx voor al je effort...

twee problemen die ik bij jou voorbeeld heb..

1.
Ik wil de HR niet zien, maar alleen de reddot
(ben net op mijn werk en heb nog niet met borders geprobeerd te spelen)

2.
Het moet generiek zijn en dus mag de HR geen width meekrijgen


Ik snap er ook geen ruk van want het lijkt me heel simpel...

//edit

Het hoeft niet op NS te werken dus mocht je een dirty IE only oplossing hebben... graag :9

//edit 2

Grmbl... kennelijk ligt het toch ergens anders aan, ik koppie peest je code in een leeg document en sla het op, werkt, welliswaar met hr

koppie peest het vervolgens in mijn eigen code... is de image goners, terwijl ze in dezelfde folder staan ;(

Flickr


  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
HR met background -> http://ppewww.ph.gla.ac.uk/~flavell/www/hrstyle.html

't is mij ook nog niet gelukt trouwens...

Flickr


  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
Een lichte zenuw inzinking later...

Het blijkt dat alleen een transparante gif wordt weergeven, elke gif zonder transparantie toont ie niet....

Excuuuuuuuse me! Maar ik snap daar dus geen ruk van...

Flickr


  • Pelle
  • Registratie: Januari 2001
  • Laatst online: 21:19

Pelle

🚴‍♂️

Op vrijdag 02 november 2001 10:29 schreef DeFeCt het volgende:
Een lichte zenuw inzinking later...

Het blijkt dat alleen een transparante gif wordt weergeven, elke gif zonder transparantie toont ie niet....

Excuuuuuuuse me! Maar ik snap daar dus geen ruk van...
Huh :? Wat bedoel je nou precies? Je reddot.gif toont 'ie wel als hij transparant is, maar niet als hij dat niet is? Vaahaaaag...

  • DeFeCt
  • Registratie: Juli 2000
  • Laatst online: 02-09 10:13

DeFeCt

je wéét toch

Topicstarter
Op vrijdag 02 november 2001 11:01 schreef Pelle het volgende:
[..]
Vaahaaaag...
Fijn dat je het met me eens bent :)

Flickr

Pagina: 1