tabel cellen met merkteken(driehoek)

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Oracle ontwikkelaar met PL/SQL en APEX in de regio

Bedrijfsomschrijving Het havengebied rondom Rotterdam biedt veel uitdagende projecten binnen o.a. container mangement, douane en warehousing. Deze organisatie biedt juist op dergelijke segmenten ICT-oplossingen van grote kwaliteit. Deze organisatie kenmerkt zich als een fullservice softwarehuis dat verantwoordelijk is voor zowel het bepalen van de informatie behoeftes bij klanten, inhouse software ontwikkeling en de implementatie van deze software. Dit doen ze inmiddels al een zeer geruime tijd voor voornamelijk klanten binnen de logistieke sector. Binnen de logistieke sector hebben ze inmiddels een imposant klantenbestand opgebouwd wat optimaal bediend wordt. Denk hierbij aan bijvoorbeeld grote vervoers/transportmaatschappijen. De organisatie is zeer goed bereikbaar

Bekijk vacature »

Jan R

Jan R

14/10/2021 14:07:47
Quote Anchor link
Hoi

Ik zou bepaalde cellen willen merken met een driehoekje.
dank zij: https://stackoverflow.com/questions/14499048/how-to-add-triangle-in-table-cell heb ik een goede start maar als ik meerdere tekens probeer lukt het me niet meer. IEmand een idee om dit op te lossen?

Jan
mijn poging
Zoals je ziet zou in de onderste lijn meerdere driehoekjes moeten staan maar ze staan er dus niet.
Gewijzigd op 14/10/2021 14:08:40 door Jan R
 
PHP hulp

PHP hulp

08/12/2021 16:20:26
 
Adoptive Solution

Adoptive Solution

14/10/2021 15:41:09
Quote Anchor link
Zoiets?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
<style>
#triangle {
    width: 300px;
    height: 300px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAHqADAAQAAAABAAAAHgAAAADKQTcFAAAAHGlET1QAAAACAAAAAAAAAA8AAAAoAAAADwAAAA8AAADJQt6m1AAAAJVJREFUSA3E0msOgjAMAGCOtPaMig8Q9RztfbadRmhJSAiom3vYpD/WR74saeMInp7xVTsbiX/gCivO+Kj56wVWnPBeC1/B8rBkhhr4Blac4VYa34Wl6An6kvhbWBqOsCuFf4QVZ7yWwL/CipO55MaD4BmHc048GJZBy3DKhUfBMjxde5sDj4ZnHI+p+E+wLDk2hxR8BAAA///0k68yAAAAoUlEQVTF0gsOgyAMBmCPBNxtU+c2X7eh3gc4jdYsJIQA6ijRxIjQ/l9IWlUZjwY+m0Ws/7wZ7K8V8ekWeOfVwserePaNbYACMVzBbR/J1wDrz+IkoBtiJP+ewd0esjUO3OcIJ8P8IMTfKdyvJ/3XUnQxnBQKhSlgrxAeqiXfQ7z1cXIkFojT3rh4rK7IPg5cbfEiQCpUg3jueKqm2JmW7LEBLTHeAaH1D6wAAAAASUVORK5CYII=');
    background-position: top right;
    background-repeat: no-repeat;
    border: 0.100em solid #999;
}
</style>

<div id="triangle"></div>


https://www.w3schools.com/cssref/pr_background-position.asp

https://www.base64-image.de/
 
Jan R

Jan R

14/10/2021 18:42:16
Quote Anchor link
Nee zal ook niet lukken. Via achtergrond heb je maar 1 foto ik wil een combinatie mogelijkheid van 8 dus dat zou 256 foto's worden. Eveneens als foto zal de hoek vertekenen als deze wijzigd in groootte

Jan
 
Rob Doemaarwat

Rob Doemaarwat

14/10/2021 20:57:16
Quote Anchor link
Naast een :after kun je ook nog een :before gebruiken, maar dan heb je een maximum van twee hoekjes.

Je kunt ook per hoekje een <span> toevoegen (binnen de <td> dus). Dus gewoon een echt element, ipv een pseudo element. En die dan absoluut positioneren tov de <td> (top, left, right, en/of bottom).
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
td{
  position: relative;
}
td span.note{
  position: absolute;
  display: block;
  border: 10px solid black;
}
td span.note.b1{
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-color: red;
  border-right-color: transparent;
  border-bottom-color: transparent;
}

<td><span class="note b1"></span><span class="note w1"></span><span class="note g1"></span>b1</td>
 
Jan R

Jan R

14/10/2021 22:07:46
Quote Anchor link
De span neemt niet de hoogte en breedte aan van de td :) en die is niet altijd even breed/hoog
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.