TWebPageControl Width

I have created www.lanotec.uk using an existing app www.rockstruck.com

How do I control the TWebPageControl Width as the second app if forcing the page wide.

Unless I’ve missed something

Are you referring to the width of the content on the Sales Enquiry tab? does that page use a different component, or have different properties than what is used on the Contacts page?

On iPhone it is wider. I have to scroll over to see the contacts tab


Yes, the titles for the pages on the lanotec site are wider than the titles on the rockstruck page, and there aren't as many places where the text can be wrapped to the next line.

One thing you can try is to reduce the left/right padding on the titles so they don't take up as much space. In CSS this can be done using something like this.

.nav-link {
  padding: 0.5rem 0.25rem;
}

image

I think right now it is 0.5rem 1rem (top/bottom left/right) so shrinking that 1rem down to 0.25rem will free up a lot of space, enough to see all the tabs.

If you use shorter names, that could help a little as well (Intro instead of introduction for example).

Thanks for the help.

Is it possible to place an image in there instead ?

Yes, you can insert whatever you like there. In the Caption property, you can insert an icon. If you are using Font Awesome, or another icon library, in your project, you can add something like this.

<i class="fa-solid fa-circle"></i>

If you want an actual image you can also use an image tag like this.

<img width="30" src="images/something.png">