Question / Help I want to enlarge the text in the browser with css

abdulhlm

New Member
Hi, I'm adding a scanner to Sahne. But there are articles on the page I added, and how can I make these very small articles grow with css? I just want to enlarge the articles, now it looks like the following.
Capture.PNG

I have added the area that I have framed in red as a scanner. His writings seem too unreadable. browser settings as follows (by default)
Capture2.PNG

I tried some css with the help of w3 school, but there is only a section called search at the top. The codes I wrote did not work in the area where the articles were.
 

carlmmii

Active Member
You need to find the right tag to reference from the source code, and apply the font-size adjustment.

For a very simple example, if the text you're trying to alter is contained in an element that has the ID of "contents", then you could do this:
Code:
#contents {
  font-size: 36pt !important;
}

Again, this is example code. You will have to figure out the proper hook for the container element.
 

abdulhlm

New Member
You need to find the right tag to reference from the source code, and apply the font-size adjustment.

For a very simple example, if the text you're trying to alter is contained in an element that has the ID of "contents", then you could do this:
Code:
#contents {
  font-size: 36pt !important;
}

Again, this is example code. You will have to figure out the proper hook for the container element.
thank you for your quick response. I pasted the code you gave under the existing code. One did not work.
Code:
body {background-color: rgba (0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
#contents {
font-size: 36pt! important;
}
I deleted the default code. I just pasted the code you gave. It didn't work.
Code:
#contents {
font-size: 36pt! important;
}
[/ code]
I removed the # sign in the code you gave and it didn't work
[code]
contents {
font-size: 36pt! important;
}
[/ code]
I changed the place pt to px that didn't work
[code]
contents {
font-size: 36px! important;
}
[/ code]

I wonder where am I doing wrong?
 

abdulhlm

New Member
You need to find the right tag to reference from the source code, and apply the font-size adjustment.

For a very simple example, if the text you're trying to alter is contained in an element that has the ID of "contents", then you could do this:
Code:
#contents {
  font-size: 36pt !important;
}

Again, this is example code. You will have to figure out the proper hook for the container element.
There is only a body tag in the default css section, no other tags. I think I will add it as Window capture. I couldn't fully understand the logic of the browser :(
 

carlmmii

Active Member
You have to actually look at the source code of the webpage you're including. Then create the CSS to modify it, and put that into the css section in your browser source properties.

I can possibly help if I could see the page that you're trying to modify. Otherwise, it's up to you to make the proper CSS for it.

There's several tutorials online for how CSS works. It's a very standardized method for styling HTML elements, and if you're only working with static HTML, it should be easy to pick up.
 

abdulhlm

New Member
You have to actually look at the source code of the webpage you're including. Then create the CSS to modify it, and put that into the css section in your browser source properties.

I can possibly help if I could see the page that you're trying to modify. Otherwise, it's up to you to make the proper CSS for it.

There's several tutorials online for how CSS works. It's a very standardized method for styling HTML elements, and if you're only working with static HTML, it should be easy to pick up.
I did not share a website to avoid advertising. If it is not against the rules, its address is exactly: http://risaleoku.com:8080/oku/hasir
 

abdulhlm

New Member
Thank you for your help, I solved the problem in another way. I right-click the page in Chrome and click on the Review button. I deleted the code for the topbar I didn't want to appear. I removed the bookmarks bar. So I got a more vertical look. Also, under normal circumstances, the page was not shrunk more than a certain size. When I pressed the Review button, I got a more narrow look.
Capture2.PNG

With this information, I came to the desired result.
Capture.PNG
 

TeenFlash

New Member
Posting this here for future reference for myself and others

for youtube chat, the code you want to add is:

Code:
yt-live-chat-text-message-renderer {
    position: relative;
    font-size: 40px;
    padding: 4px 24px;
    overflow: hidden;
    contain: content;
    --yt-endpoint-color: var(--yt-live-chat-primary-text-color, var(--yt-deprecated-luna-black));
    --yt-endpoint-hover-color: var(--yt-live-chat-primary-text-color, var(--yt-endpoint-color));
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}

change the font size according to your choice
 

BrentHarmon

New Member
Posting this here for future reference for myself and others

for youtube chat, the code you want to add is:

Code:
yt-live-chat-text-message-renderer {
    position: relative;
    font-size: 40px;
    padding: 4px 24px;
    overflow: hidden;
    contain: content;
    --yt-endpoint-color: var(--yt-live-chat-primary-text-color, var(--yt-deprecated-luna-black));
    --yt-endpoint-hover-color: var(--yt-live-chat-primary-text-color, var(--yt-endpoint-color));
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}

change the font size according to your choice

Sorry for bumping this back up, but I want to know is there a way to enlarge the YouTube Avatar aka person profile pictures ?
 
Top