html - How to reduce the height of my div element, relative to the other div element -
i trying reduce height of div element contains content smaller it's corresponding div content not overflow other elements method executing type of problem.
<!doctype html> <html> <head> <script> .atlas.region-map { border: 2px solid #716e64; max-width: 500px; overflow: hidden; margin: 0; float: left; } .atlas .map-content .info-col { margin-left: 549px; width: 335px; } .atlas .map-content .info-col p { color: #5c5642; margin-top: 15px; font-size: 12px; } .atlas_test { height: 300px; font-size: 14px; overflow-y: scroll; } </script> </head> <body> <div class="info-col"> <p>content go here</p> </div> </body>
if not working, isn't executing!
you need place css coding in style
element not in script
. script element js codes.
however, lessen size of div can try code:
max-height: 90%; // shorten it!
this way can stop div getting bigger size. , content won't move out. using code, element 90% of parent element's height size! not moving out of solution box.
to provide scroll bar use:
overflow: scroll;
Comments
Post a Comment