is there a way to make this red part float to the screen?
Had you posted again?
yes i need help
Please use one thread only and not spamming the forum with new posts if you haven’t received help.
2 Likes
Surely there is a way to make an inline float on the screen.
But what I see surrounded in red is an horizontal inline list component? If it is, I think you must have already stylized it to appear as I see; if it is:
- which CSS is applied to make it appear like this?
- do you have other horizontal inline lists on the same screen?
Let me know
1 Like
I use 2 [inline list cards] and 1 CSS to put it on the same line. I’m trying to make it float on the screen as a menu bar
In this case, as by @ThinhDinh and @Lucas_Pires know-how, you can select the component by its order in the detail screen.
So, supposing the first element is the RT component containing the CSS, your two inline horizontal list components will be the 2nd and the 3rd element.
In the above scenario this example of code will work:
<pre><span><style>
div[id*='screenScrollView'] > div > :nth-of-type(2) {
background-color: yellow;
left: 10px;
width: 300px;
top 10%;
height: 50px;
z-index: 10;
position: fixed;
}
div[id*='screenScrollView'] > div > :nth-of-type(3) {
background-color: red;
top 10%;
left: 310px;
width: 54px;
height: 50px;
z-index: 10;
position: fixed;
}
I intentionally left yellow and red backgrounds just to have a visual size rapresentation of the two components; size and position can be adjusted to your specific need, of course.
It is probably not the perfect solution, and perhaps even better can be done, because by rotating the screen the two components will not be centered horizontally. In the meantime, however, this can be a good base to work on.
Bye
3 Likes
wait i forget to float … 
Now it’s ok
Thank you for your help.
Looks like it’s crashing due to a combination of css
/* Text Entry (2nd component) */
div[id*='screenScrollView'] > div > :nth-child(1) {
margin-left:-0px;
width:86%;
height:75px;
}
/* Number Entry (3eme component) */
div[id*='screenScrollView'] > div > :nth-child(2) {
margin-top:-55px;
margin-left:85%;
transform: translateX(-25%);
width:20%;
height:50px;
}
Of course, this is why I asked you to see your css first …
I need to see your CSS conflicting otherwise I can’t help you better than that.