# Zoom web sdk UI design

**URL:** <https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096>\
**Category:** Web\
**Created:** [September 28, 2021, 11:53am UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096 "2021-09-28T11:53:50Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![tomjose666](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tomjose666/32/31427_2.png) [@tomjose666](https://devforum.zoom.us/u/tomjose666)\
**Post date:** [September 28, 2021, 11:53am UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096/1 "2021-09-28T11:53:50Z")

</div>

**Description**  
I am trying to increase the width of the speaker view video which appears on the top of main video. But i am not able to do that. Is there any way i can fix it.

**Screenshots**  
[https://www.awesomescreenshot.com/image/14140463?key=00a4e4d699b023fcaba994d6a8586596](https://www.awesomescreenshot.com/image/14140463?key=00a4e4d699b023fcaba994d6a8586596)  
above is the screenshot for my requirement

**Additional context**  
i didn’t found any documentation for styling the UI.

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [September 28, 2021, 2:28pm UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096/2 "2021-09-28T14:28:10Z")

</div>

Hey @tomjose666 , happy to help!

You can increase a video stream size like so:

JS

```auto
this.stream.renderVideo(canvas, this.self, 1200, 800, 0, 0, 2);

```

HTML

```auto
<canvas id="canvas2" width="1920" height="1080"></canvas>

```

CSS

```css
#canvas2 {
  width: 100%;
}

```

Let me know if that helps!

Thanks,  
Tommy

---

<div class="post-metadata">

**Author:** ![tomjose666](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tomjose666/32/31427_2.png) [@tomjose666](https://devforum.zoom.us/u/tomjose666)\
**Post date:** [October 19, 2021, 1:50pm UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096/3 "2021-10-19T13:50:31Z")

</div>

Hi @tommy , Thanks for your fast reply.  
I am using meeting sdk in my web project.is there any way to prevent the floating video screen when i start screen share. what I need is to show both the participants videos on the bounded div only.

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [October 29, 2021, 9:31pm UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096/4 "2021-10-29T21:31:43Z")

</div>

Hey @tomjose666 ,

With version 2.0.1, in Chrome, there is now side by side mode during screenshare:

 ![image](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/7/7/77c1c58a4bac8c7f6462b090e66d172017ac2025.jpeg)

Thanks,  
Tommy

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/6/1/614bdd549b610bbaa46ff934617683a02bdaa03c.png) [@system](https://devforum.zoom.us/u/system)\
**Post date:** [November 29, 2021, 7:32am UTC](https://devforum.zoom.us/t/zoom-web-sdk-ui-design/58096/5 "2021-11-29T07:32:31Z")

</div>

Closed on November 29, 2021, 7:32am UTC

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.