I am currently creating a blog website which contains dynamic pages for articles, so I do not have to duplicate and rework already existing articles every time I upload a new one. This is the rough visual appearance of it:
- The dynamic page has a vertical line down the middle so it is split into two exactly the same columns side by side. - There is a photo at the top of the page, which the line also splits in two. The photo is bound to a database and changes according to the article. The line in the middle of it stays and is layered in front of.
- Each side of the page that is split by the line contains an article and its title. One on the left and one on the right, usually different in length. The line down the middle is supposed to go as far down as to match the length of the textbox of the longer one of the 2 articles.
Now the problem is that the line is a fixed element that I added to the dynamic page manually and does not change its length when the textboxes on either side of it expand or contract according to the data they receive from the database. So if one article is longer than the default one, the line down the middle stays too long, whilst if another article is longer, the line stays too short. Is there a way to make the line adjust to the length of the longer one of the 2 articles?
Thank you in advance!