Title: Sidebar style issue
Last modified: August 22, 2016

---

# Sidebar style issue

 *  Resolved [Samar Hatem](https://wordpress.org/support/users/samar-hatem/)
 * (@samar-hatem)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/sidebar-style-issue/)
 * Hi everyone,
    I designed the search result page so the content is on the left
   and the sidebar is on the right. when I search something and I got search result,
   everything goes well, the style is rendered properly exactly the way I intended,
   but if there’s no search result something weird happen, I get the content on 
   the left and instead of getting the sidebar on the right it becomes under the
   content !! here’s my php code:
 *     ```
       <?php get_header(); ?>
       	<div class="main-content-wrap">
       		<div id="content-holder">
       			<div class="left-side">
       				<div class="search-result">
       						<h2>Search Result:</h2>
   
       						<ul>
       								<?php if(have_posts()) : while(have_posts()) : the_post();?>
       								<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
       								<?php endwhile; ?>
       						</ul>
   
       				</div><!-- end search result -->
       				<div id="morePrev">
       					<?php next_posts_link('More...'); ?>
       					<?php previous_posts_link('Return...'); ?>
       				</div>
   
       			<?php else: ?>
       			<p>no posts</p>
       			<?php endif; ?>
       			</div><!-- end left side -->
       <?php get_sidebar(); ?>
       		</div><!-- end conetent holder -->
       	</div><!-- end main content wrap -->
       <?php get_footer(); ?>
       ```
   
 * and here is my CSS
 *     ```
       .main-content-wrap{
       width: 100%;
       float: left;
       overflow: hidden;
       background: transparent;
       }
   
       #content-holder {
       width: 1000px;
       overflow: hidden;
       margin-right: auto;
       margin-left: auto;
       }
   
       .left-side{
       width: 680px;
       float: left;
       overflow: hidden;
       background-color: #fff;
       }
   
       #morePrev {
       margin-top: 20px;
       width: 600px;
       overflow: hidden;
       margin-right: auto;
       margin-left: auto;
       }
   
       div#morePrev a:first-child {
       float: right;
       }
   
       div#morePrev a:last-child {
       float: left;
       }
   
       .sidebar{
       width: 300px;
       float: left;
       margin-left: 20px;
       overflow: hidden;
       background-color: rgb(250, 250, 250);
       }
   
       .search-result {
       float: left;
       width: 650px;
       overflow: hidden;
       border: 2px solid #cecece;
       padding-bottom: 20px;
       margin-top: 30px;
       margin-bottom: 20px;
       }
   
       .search-result h2 {
       float: left;
       display: block;
       width: 100%;
       }
   
       .search-result ul {
       list-style-type: none;
       float: left;
       margin-top: 30px;
       margin-left: 60px;
       }
   
       .search-result ul li {
       display: block;
       }
       ```
   
 * any ideas?

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/sidebar-style-issue/#post-5227825)
 * your if/else is in the middle of html tags, and therefore breaking the code.
 * try:
 *     ```
       <?php get_header(); ?>
       	<div class="main-content-wrap">
       		<div id="content-holder">
       			<div class="left-side">
       				<div class="search-result">
       						<h2>Search Result:</h2>
   
       						<ul>
       								<?php if(have_posts()) : while(have_posts()) : the_post();?>
       								<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
       								<?php endwhile; ?>
       						</ul>
   
       				</div><!-- end search result -->
       				<div id="morePrev">
       					<?php next_posts_link('More...'); ?>
       					<?php previous_posts_link('Return...'); ?>
       				</div>
   
       			<?php else: ?>
       			<li><p>no posts</p></li>
       						</ul>
       				</div><!-- end search result -->
   
       			<?php endif; ?>
       			</div><!-- end left side -->
       <?php get_sidebar(); ?>
       		</div><!-- end conetent holder -->
       	</div><!-- end main content wrap -->
       <?php get_footer(); ?>
       ```
   
 *  Thread Starter [Samar Hatem](https://wordpress.org/support/users/samar-hatem/)
 * (@samar-hatem)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/sidebar-style-issue/#post-5227922)
 * Thanks so much alchymyth, it worked.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Sidebar style issue’ is closed to new replies.

## Tags

 * [sidebar issue](https://wordpress.org/support/topic-tag/sidebar-issue/)
 * [style](https://wordpress.org/support/topic-tag/style/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 2 replies
 * 2 participants
 * Last reply from: [Samar Hatem](https://wordpress.org/support/users/samar-hatem/)
 * Last activity: [11 years, 8 months ago](https://wordpress.org/support/topic/sidebar-style-issue/#post-5227922)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics