Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

First, take into consideration that I have limited web development knowledge. I tried to insert into a page, a Bootstrap nav component.

I added the bootstrap folder in my theme folder, loaded the scripts and styles with wp_enqueue_script and wp_enqueue_style and added some HTML inside my page.

<ul class="nav nav-tabs">
  <li class="active">
    <a href="#menus">Menus</a>
  </li>
  <li><a href="#connect">Se connecter</a></li>
  <li><a href="#dashboard">Tableau de bord</a></li>
</ul>

All was fine, it looked good :

It looked fine

But when I try to add a dropdown menu, there's is weird shift in the nav. Here's the code

<ul class="nav nav-tabs">
  <li class="active"><a href="#menus">Menus</a></li>
  <li><a href="#connect">Se connecter</a></li>
  <li><a href="#dashboard">Tableau de bord</a></li>
  <li class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#">Ajout d'images<b class="caret"></b></a>
    <ul class="dropdown-menu">
      <li><a href="#first_pic">Grandes photos</a></li>
      <li><a href="#second_pic">Galeries</a></li>
      <li><a href="#thirs_pic">Archive de photos</a></li>
    </ul>
  </li>
</ul>

Doesn't look good

There are 20-ish pixels between the line and the tabs.

I should tell you that I use a theme named Meola developed by Elmastudio. Maybe that's what messing the nav but I tried to load my page without their CSS and while it seemed less wide, there was still a shift.

(Sorry for my english, I'm not an native English speaker. And thanks to the person that can display my images in this post (I don't have the 10 reps to do so).)

share|improve this question
1  
Add your solution as an answer, and then accept the answer once you're able to. That way, if someone else has the same problem, they will benefit from your experiences. –  Pat J Jul 17 '13 at 2:43
add comment

1 Answer

up vote 1 down vote accepted

Ok so I found out what was wrong : it seems that WordPress adds empty p tags into your code. So I had one of those in my HTML and it was messing up the layout. To tell WordPress to stop doing that, you have to comment this line

 add_filter( 'the_content', 'wpautop' );

which is in default-filters.php in the wp-include directory at the root of your site. It should work.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.