I have a PHP code

<?php $j = 0; foreach($v->valeur as $valeur) { ?>
 <input type="checkbox" 
  
 name="check<?php echo $v->id; ?>[]"
 value="<?php echo $j; ?>"
 <?php if(strpos($v->active,','.$j.',')!==false) echo ' checked'; ?> 
 data-labelauty="<?php echo $valeur; ?>" />
 <?php echo $valeur.str_repeat('&nbsp;', 2); ?>
 <?php   $j; ?>[![enter image description here][1]][1]
<?php } ?>

where echo $valeur.str_repeat(' ', 2); generates " Djembe   ". My problem is that I want the checkbox and the text to be on THE SAME LINE reagardless of screen width. See some code and desirde output

CodePudding user response：

To keep the checkbox and text on one line, you can use the CSS property "display: inline-block;" on the checkbox and text elements. This will ensure that both elements remain on the same line, regardless of the screen width. For example:

<input type="checkbox" 
  
 name="check<?php echo $v->id; ?>[]"
 value="<?php echo $j; ?>"
 <?php if(strpos($v->active,','.$j.',')!==false) echo ' checked'; ?> 
 data-labelauty="<?php echo $valeur; ?>"
style="display:inline-block;" />
 <?php echo $valeur.str_repeat('&nbsp;', 2); ?>
style="display:inline-block;">
<?php   $j; ?>

CodePudding user response：

You have to warp the input and text in tag like label or div and give that tag property display: inline-block;

check: https://jsfiddle.net/2tg54uzj/

CodePudding user response：

OK, solved it like this:

<?php } else if($v->type==4) { ?>
<?php $j = 0; foreach($v->valeur as $valeur) { ?>

<div  style="display:inline-block;">

<input type="checkbox"  name="check<?php echo $v->id; ?>[]" 
value="<?php echo $j; ?>"<?php if(strpos($v->active,','.$j.',')!==false) 
echo ' checked'; ?> data-labelauty="<?php echo $valeur; ?>" />
<?php echo $valeur.str_repeat('&nbsp;', 2); ?>
</div>
<?php   $j; ?>