I'm trying to skin HTML output which I don't have control over. One of the elements is a div
with a style="overflow: auto"
attribute.
Is there a way in CSS to force that div
to use overflow: hidden;
?
The <div> tag defines a division or a section in an HTML document. The <div> tag is used as a container for HTML elements - which is then styled with CSS or manipulated with JavaScript. The <div> tag is easily styled by using the class or id attribute. Any sort of content can be put inside the <div> tag!
Just add overflow: auto; to the <ul> . That will make it so that the text doesn't leak outside of the UL. However, depending on what you're doing, it might be easier to just make the <li> display: inline; . It totally depends on what you're doing!
You'll primarily use the div tag to group similar content together so you can style it easily. A great example of this is using div to group different sections of a webpage together. You can put together the header, nav, sections, and footer of a page in an individual div tag so they can be styled together.
You can add !important
to the end of your style, like this:
element { overflow: hidden !important; }
This is something you should not rely on normally, but in your case that's the best option. Changing the value in Javascript strays from the best practice of separating markup, presentation, and behavior (html/css/javascript).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With