Modify SharePoint List column width of custom webpart with HTML source

Question

I have a custom webpart called Available seminars:

I want to modify the width of certain columns.

On the Internet it is written that I have to use

<style type='text/css'>  
    .ms-vh-div[DisplayName='<ColumnName>'] {  
        width: 250px;  
    }  
</style> 

But the problem is that I can't edit the source of Available Seminars. (See the blue border in the image). I can edit the source of my content editor, but not of my custom webpart.

When I click on Edit Source, this shows up:

<div class="ms-rtestate-read ms-rte-wpbox" contenteditable="false" unselectable="on">
   <div class="ms-rtestate-notify  ms-rtestate-read 75788cb9-fede-4c30-931f-34dfb6a75048" id="div_75788cb9-fede-4c30-931f-34dfb6a75048" unselectable="on">
   </div>
   <div id="vid_75788cb9-fede-4c30-931f-34dfb6a75048" unselectable="on" style="display: none;">
   </div>
</div>
<div class="ms-rtestate-read ms-rte-wpbox" contenteditable="false" unselectable="on">
   <div class="ms-rtestate-notify  ms-rtestate-read 1ba441c2-b2e9-42a7-b0cc-506e02119f5c" id="div_1ba441c2-b2e9-42a7-b0cc-506e02119f5c" unselectable="on">
   </div>
   <div id="vid_1ba441c2-b2e9-42a7-b0cc-506e02119f5c" unselectable="on" style="display: none;">
   </div>
</div>
<div class="ms-rtestate-read ms-rte-wpbox" contenteditable="false" unselectable="on">
   <div class="ms-rtestate-notify  ms-rtestate-read 92217f41-4296-4700-9b00-0a556b46141d" id="div_92217f41-4296-4700-9b00-0a556b46141d" unselectable="on">
   </div>
   <div id="vid_92217f41-4296-4700-9b00-0a556b46141d" unselectable="on" style="display: none;">
   </div>
</div> 
<br/>

And when I add

<style type='text/css'>  
    .ms-vh-div[DisplayName='<Title>'] {  
        width: 450px;  
    }  
</style> 

then nothing happens.

Does someone know a solution to this?

Here's what shows up when I go to title with the dev tools:

Answer 1

Try this, it works for me

.ms-vh-div[displayname='Title'] {
    width: 450px;
}