CSS height not change

I am trying to change the height of the following element:

<div class="panel-body" ">

via external css file and any change that i put it didn’t pass to the element.It keeps the initial height.
How i can fix it?
PS
I change the height passing the style css inside html tag but i don’t want to make with this way

<div class="panel-body" style="height: 700px;">

Can you show the css you apply to the class and also the content of the div.
Or maybe a working (not-working) example of this on a page.
Surely .panel-body { height: 700px; } would work.
Though it’s usual to let the content set the height for most containers and use padding to create any extra space needed.

1 Like

With the code, we would be able to see if it is a problem with specificity. For example, if the div height is originally set using something like .main-content .panel-body { height: 500px; }, just writing .panel-body { height: 700px; } will not affect the height of the div, because the first style has a stronger effect on the height.

2 Likes

i don’t know if you copy-pasted from your code, but you have glaring typo that may be interfering with the output. <div class="panel-body" "> should be <div class="panel-body">

2 Likes

Yes, that typo should be fixed and am not seeing why your code shouldn’t work. It will be better if you could provide code that surrounds your div and it’s style.

1 Like

Thanks a lot guys.

If you fixed the problem, please tell us what you found so others will know, too.

:slight_smile:

Finally i found that nothing else affect the class=panel-body (i checked all the css file ) as you said and i decide to keep the css height inline style.I don’t know what causes that but your advisory teach me a more about these problems

It is often quite easy to find what css is (or is not) affecting an particular element using the browsers dev tools, but that’s not possible without having a working page to inspect.

I would not call that a satisfactory fix. I’m sure the problem could be solved, if only all the relevant code was available to view.

Finally I solve the problem.The only thing was to refresh the page with CTRL-F5 so to reload tha page without cache contents.

2 Likes

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