cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Responsive Resident
Responsive Resident

Can we make HTML text Box A responsive or dynamic box ?

Hi All 

 

I'm trying to create some responsive app, i know HTML is good for a lot of stuff when it comes to Appearance of any application, 

 

Hence I'm just a bit confused, is there any way where we can make HTML Text Box a responsive so that it adapts the height and width the way screen changes. 

 

 

If yes how can we do? 

 

Any suggestions on this ? 

 

Please my solution below, the image which shows the result of HTML text box, which is static and fixed at one position how ever i need that to be dynamic.

 

The code

"<div style='margin:10px;width:589px;height:112px;background-color:#;box-shadow:0 3px 6px 1px  #ccc; border-radius:15px'>

</div> "

result

Untitled.png

Thanks 

 

 

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Community Support
Community Support

Hi @Tapesh :

Do you want to create responsive HTML images?

The answer is yes.

The key is to use "&" to connect the string and the formula.

Ive made a test for your reference:

 

"<div style='margin:10px;width:" & Parent.Width / 2 & "px;height:" & Parent.Height / 2 & "px;background-color:#;box-shadow:0 3px 6px 1px  #ccc; border-radius:15px'>
</div> "
/* The length and width of the image will automatically become half of the screen*/

 

 

Best Regards,

Bof

View solution in original post

3 REPLIES 3
Highlighted
Super User
Super User

Not quite understanding your question - in the html snip you've posted, there is an absolute width and height. 

See https://www.w3schools.com/html/html_responsive.asp for more info on how to make your html responsive to the available viewport.

Highlighted
Community Support
Community Support

Hi @Tapesh :

Do you want to create responsive HTML images?

The answer is yes.

The key is to use "&" to connect the string and the formula.

Ive made a test for your reference:

 

"<div style='margin:10px;width:" & Parent.Width / 2 & "px;height:" & Parent.Height / 2 & "px;background-color:#;box-shadow:0 3px 6px 1px  #ccc; border-radius:15px'>
</div> "
/* The length and width of the image will automatically become half of the screen*/

 

 

Best Regards,

Bof

View solution in original post

Highlighted

@v-bofeng-msft 

 

Thanks so much for the help and support this was really needed as i was looking for solution related to this since long.  Thanks a lot for your help again. 

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

News & Announcements

Community Blog

Stay up tp date on the latest blogs and activities in the community News & Announcements.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Users online (8,002)