Text highlighting within table row - html

I have a table with 4 columns and dynamic number of rows. Each row has multiple lines of text. I'd like to highlight every other line of text (not every other row). The number of lines in a row/cell is dynamic. I have seen a lot of examples on how to highlight every other row in a table but i haven't been able to find any examples on how to highlight every other line of text within a row. Is this possible?

Related

Create an HTML table where text overflows across rows within a column

I need to create a table (or something that is rendered like a table; it's meant to be printed and I don't care what it is semantically) where the text flows automatically from one row to the next within the same column. Also, the columns need to have a pre-determined width, and there must be a pre-determined number of rows (with extra empty rows if needed).
Example:
The reason behind this, in case you're wondering, is that it's meant to emulate text that's hand-written into a printed form that looks like the table above, only empty.
How would you do this?

How to get CSS grid to span across columns into the next row?

I am building a site, and am trying to create a page where I can talk about some of the coding projects I have done. I have used grids for the majority of my site, and would like to keep it consistent throughout but I can't seem to find a way to have a box span to the end of its column, and then and then continue into the next row starting the first column. I have looked through the css documentation, and also through stack overflow, and am a little surprised this question hasn't been raised before. My grid is made up of 3 rows and 4 columns, so its 12 total boxes. I want to start in the first row, third column and span the rest of the column, and then continue into the second row, and starting with the first column span all the way until the end, and then continue into the third row and span the first two columns. The reason I want to do this is that boxes 1 and 2, and 11 and 12 will contain images, and the big area I am trying to create will contain text, so the text will wrap nicely around the images. If you could help me out, or suggest another way in which this can be done I would be appreciative. What I am trying to accomplish, I want to put one block of text in the area that starts with 3 and ends with 10

Design table with dependent columns

I have some data to display in as in the image above. Student Names column each line is dependent on Student Results column.
In a scenario where the cell's width is small is fit the one line text it will occupy the next line and dependent column line mapping is lost.
Question:
Is there any UX guideline/recommendation for display this type of
information.
You are trying to create a table with multiple keys and values in one line. Try to assign every tuple to an own line in the table. Then style your table by assigning borders where you want them. That way, your lines will stay matched.

Alternate table row shading when first column spans two rows?

I've used alternate table row shading before (using the ::nth-child selector), but I noticed it can't get the job done when you have irregular table structure. I've come across one specific case for which I'd like to come up with a solution.
In the picture below, you can see that the rows are styled with ::nth-child(even) to give every other row a background color:
The problem here is that in some cases, the first column cell spans two rows, causing the rest of the cells in that "row" (which is really two rows) to appear disjointed or misaligned. The cells in the rows spanned by "Cole" should have the same background color as the first column's cell, because the following columns are all related to the first one. Is this achievable using strictly CSS?
I would just change the structure of the table, but the people entering this content are using a CMS with a built-in text editor, and they have no control over the format. I'd have to manually change every table on their site, which would be a huge undertaking (and it wouldn't account for future tables).

SSRS: Stop large row moving to new page

I have a small issue when rendering my report.
I'm pulling a list of objects on an agreement, each object has an undefined character length, some consist of several lines of text, others a single line.
Issue is, each row that contains a large amount of text is moving to a new page in entirety, what I would like to happen is that the row split across on to the next page.
In other words, if a page can only take 5 more lines/rows and a single row hold 15 lines of text, then I want the first 5 lines of the row on the bottom of the current page and then the remaining 10 lines of text moved to the top of the next page.
I've played with all the row grouping settings in SSRS with no luck.
I hope my explanation makes sense.
Thanks in advance,
Dane
Rather than break a row into multiple pages, have you considered transforming your data set by breaking large rows up into multiple smaller rows?