div tag gets different heights in local and live servers

Question

cgull 25 Light Poster

11 Years Ago

Hello,

Using codeigniter 2.1.2 and Bootstrap 2.3.1.

I have just uploaded files from a local site to a live server.

Somehow a div inside an accordion div gets different heights:

On my local site I have this div:
<div id="ui-accordion-1-panel-0" class="row ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="padding: 0.5em 0px; display: block; height: 529.2px;" aria-labelledby="ui-accordion-1-header-0" role="tabpanel" aria-expanded="true" aria-hidden="false">

On the live site the same div had a different height:
<div id="ui-accordion-1-panel-0" class="row ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="padding: 0.5em 0px; display: block; height: 279.2px;" aria-labelledby="ui-accordion-1-header-0" role="tabpanel" aria-expanded="true" aria-hidden="false">

My code:

 <div class="accordion">
        <?php foreach($provinces as $province): ?>
        <h3><?php echo $province->name; ?></h3>

        <div class="row" style="padding: .5em 0;">//This is the div that gets different heights

How can that happen?

codeigniter css-bootstrap html-css web-design

4 Contributors
9 Replies
268 Views
1 Day Discussion Span
Latest Post 11 Years Ago Latest Post by cgull

Octet 45 Newbie Poster

11 Years Ago

Strange, no reason why I can see this would happen...

My only suggestion would be to define the DIV heights specifically and see how this goes?

Octet 45 Newbie Poster

11 Years Ago

Glad you solved the problem.

Don't forget to mark the thread as completed and good luck with your developing!

JorgeM 958 Problem Solver

11 Years Ago

I have a php warning that was not shown on the live server but is shown on the dev server.

Any information that you can provide with regard to the known issue and how you actually solved it would be helpful for others that come across this thread with a similiar issue.

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

RvSon -3 Newbie Poster · Answer 1 · 2013-03-27T09:54:54+00:00

Are you Displying both outputs in same browser?

cgull 25 Light Poster · Answer 2 · 2013-03-27T11:06:29+00:00

Yes, browsing local and live on the same browser, Firefox.

Yes, added height to the div style like so:
<div style="height: 400px;">

Live changed to 400px, local stayed the same.

How strange is that?

And the funny thing, for once, things are working as I want on the live server.... but still... lol

cgull 25 Light Poster · Answer 3 · 2013-03-27T11:21:17+00:00

Tried to add: <div style="max-height: 300px"> that helped on the local site, but of course, I don't want to add this rule, it was just for testing.

Maybe I should also add, that this div has also the Bootstrap row class added to it. Don't know if it matters in this case.

RvSon -3 Newbie Poster · Answer 4 · 2013-03-27T11:24:59+00:00

Try with Inline style to set the style of div ?

cgull 25 Light Poster · Answer 5 · 2013-03-27T14:05:16+00:00

FOUND IT !!!!!

Oh dear, I have a php warning that was not shown on the live server but is shown on the dev server.

But this warning appears only on some of the accordion tabs so I didn't see it on the dev server as well until I moved to a different tab.

That's what created the extra space and made the div look higher....

OHHHHHHHHHHHHHHHH

:)

cgull 25 Light Poster · Answer 6 · 2013-03-28T07:53:43+00:00

Any information that you can provide with regard to the known issue and how you actually solved it would be helpful for others that come across this thread with a similiar issue.

I think the information is in the post?

Dev server was set up to display php errors and live server was set up to not display php errors.