'Buttons same line
I want to put the three buttons in the same line. How should I do it with CSS?
The three buttons are: #search_keywords, #search_location and #search_submit.
`<form class="job_filters"> <?php do_action( 'job_manager_job_filters_start', $atts ); ?>
<div class="search_jobs">
<?php do_action( 'job_manager_job_filters_search_jobs_start', $atts ); ?>
<div class="search_keywords">
<label for="search_keywords"><?php esc_html_e( 'Keywords', 'wp-job-manager' ); ?></label>
<input type="text" name="search_keywords" id="search_keywords" placeholder="<?php esc_attr_e( 'Keywords', 'wp-job-manager' ); ?>" value="<?php echo esc_attr( $keywords ); ?>" />
</div>
<div class="search_location">
<label for="search_location"><?php esc_html_e( 'Location', 'wp-job-manager' ); ?></label>
<input type="text" name="search_location" id="search_location" placeholder="<?php esc_attr_e( 'Location', 'wp-job-manager' ); ?>" value="<?php echo esc_attr( $location ); ?>" />
</div>
<div style="clear: both"></div>
<?php if ( $categories ) : ?>
<?php foreach ( $categories as $category ) : ?>
<input type="hidden" name="search_categories[]" value="<?php echo esc_attr( sanitize_title( $category ) ); ?>" />
<?php endforeach; ?>
<?php elseif ( $show_categories && ! is_tax( 'job_listing_category' ) && get_terms( [ 'taxonomy' => 'job_listing_category' ] ) ) : ?>
<div class="search_categories">
<label for="search_categories"><?php esc_html_e( 'Category', 'wp-job-manager' ); ?></label>
<?php if ( $show_category_multiselect ) : ?>
<?php job_manager_dropdown_categories( [ 'taxonomy' => 'job_listing_category', 'hierarchical' => 1, 'name' => 'search_categories', 'orderby' => 'name', 'selected' => $selected_category, 'hide_empty' => true ] ); ?>
<?php else : ?>
<?php job_manager_dropdown_categories( [ 'taxonomy' => 'job_listing_category', 'hierarchical' => 1, 'show_option_all' => __( 'Any category', 'wp-job-manager' ), 'name' => 'search_categories', 'orderby' => 'name', 'selected' => $selected_category, 'multiple' => false, 'hide_empty' => true ] ); ?>
<?php endif; ?>
</div>
<?php endif; ?>
<?php
/**
* Show the submit button on the job filters form.
*
* @since 1.33.0
*
* @param bool $show_submit_button Whether to show the button. Defaults to true.
* @return bool
*/
if ( apply_filters( 'job_manager_job_filters_show_submit_button', true ) ) :
?>
<div class="search_submit">
<input type="submit" value="<?php esc_attr_e( 'Search Jobs', 'wp-job-manager' ); ?>">
</div>
<?php endif; ?>
<?php do_action( 'job_manager_job_filters_search_jobs_end', $atts ); ?>
</div>
<?php do_action( 'job_manager_job_filters_end', $atts ); ?>
`
I tried inline-block, etc. but i'm not reaching what I really want.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
