無法刪除保證金引導

我有一個差距正好低於我的第一個預標籤我無法刪除它。無法刪除保證金引導

我已經試過

pre { 
    margin: 0 0 0; 
}

而且

pre { 
    margin: 0 0 0 !important; 
}

但仍顯示

問題：怎麼可能正確刪除邊緣或填充剛剛低於第一個預先？

注：剛剛發現是與nl2br的控制器功能如下

我用笨和Ajax生成預覽。

CSS

<style type="text/css"> 

body { 
    background-color: #F0F0F0; 
} 

pre { 
    display: block; 
    padding: 9.5px; 
    margin: 0 0 0 !important; 
    font-size: 13px; 
    line-height: 1.42857143; 
    color: #333; 
    word-break: break-all; 
    word-wrap: break-word; 
    background-color: #f5f5f5; 
    border: 1px solid #ccc; 
    border-radius: 4px; 
} 

hr { 
    background-color: #dedede !important; 
    height: 1px !important; 
} 

h1, 
h2, 
h3, 
h4, 
h5, 
h6 { 
    margin: 0; 
    padding: 0; 
    font-family: Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif; 
    margin-top: 0; 
} 
</style>

腳本

<script type="text/javascript"> 
$('#preview-question').on('click', function (e) { 
    $.ajax({ 
     url: "<?php echo base_url('question/preview');?>", 
     type: 'POST', 
     data: { 
      title: $('#title').val(), 
      question: $('#question').val(), 
      '<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>' 
     }, 
     dataType: 'json', 
     success: function(response){ 
      if (response.success) { 
       $('#preview').html(response.question); 
       $('#preview pre br').remove(); 
       var str = $('#preview pre').html(); 
       $('#preview pre').html(str.replace(/</g, "&lt;").replace(/>/g, "&gt;")); 
       $('pre').each(function(i, block) { 
        hljs.highlightBlock(block); 
       }); 
      } else { 

      } 
     } 

    }); 

    e.preventDefault(); 
}); 
</script>

功能

public function preview() { 

    $data = array('success' => false, 'question' => ''); 

    if ($_POST) { 

     $data['question'] = nl2br($this->input->post('question')); 

     $data['success'] = true; 
    } 

    echo json_encode($data); 
}

FULL HTML

<?php echo form_open_multipart('question/create', array('id' => 'question_create', 'class' => 'form-horizontal', 'role' => 'form'));?> 
<div class="container"> 
<div class="row"> 

<div class="panel panel-default"> 
<div class="panel-heading"> 
<h1 class="panel-title"></h1> 
</div> 
<div class="panel-body"> 

<div class="form-group"> 
<label class="col-lg-2">Title</label> 
<div class="col-lg-10"> 
<input type="text" name="title" id="title" class="form-control" placeholder="Title" /> 
</div> 
</div> 

<div class="form-group"> 
<label class="col-lg-2">Question</label> 
<div class="col-lg-10"> 
<textarea name="question" id="question" class="form-control" rows="10"></textarea> 
</div> 
</div> 

<div class="form-group"> 
<label class="col-lg-2"></label> 
<div class="col-lg-10"> 
<div id="preview"></div> 
</div> 
</div> 

</div> 
<div class="panel-footer"> 
<div class="text-center"> 
<button type="submit" class="btn btn-primary">Submit</button> 
<button type="button" id="preview-question" class="btn btn-default">Preview</button> 
<button type="button" class="btn btn-warning">Clear Textarea</button> 
<a href="" class="btn btn-danger" role="button">Cancel</a> 
</div> 
</div> 
</div> 

</div> 
</div> 
<script type="text/javascript"> 
$('#preview-question').on('click', function (e) { 
    $.ajax({ 
     url: "<?php echo base_url('question/preview');?>", 
     type: 'POST', 
     data: { 
      title: $('#title').val(), 
      question: $('#question').val(), 
      '<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>' 
     }, 
     dataType: 'json', 
     success: function(response){ 
      if (response.success) { 
       $('#preview').html(response.question); 
       $('#preview pre br').remove(); 
       var str = $('#preview pre').html(); 
       $('#preview pre').html(str.replace(/</g, "&lt;").replace(/>/g, "&gt;")); 
       $('#preview pre').each(function(i, block) { 
        hljs.highlightBlock(block); 
       }); 
      } else { 

      } 
     } 

    }); 

    e.preventDefault(); 
}); 
</script> 
<?php echo form_close();?>

來源

2016-10-28 user4419336

它與控制器功能上的nl2br有關 – user4419336

您能否給我在瀏覽器中元素的HTML？ – djl

@djl我注意到它與控制器 – user4419336

首先，我認爲你應該使用

預{

margin: 0 0 0 0 !important;

}
而不是

預{

margin: 0 0 0 !important;

}
讓我知道這是否有助於

來源

2016-10-28 08:52:00

沒有抱歉沒有 – user4419336

添加清除AR到預先標記

pre { 
    clear:both; 
}

來源

2016-10-28 09:06:21 Vishnu

，如果你格式化你的HTML這樣的，我認爲，你可以管理pre元素的邊緣。您必須應用「箱子」式的顏色和背景，例如到.highlight類和其他樣式到pre。

如果您使用與引導程序相同的「代碼識別器」，則code元素是可選的。

HTML

<figure class="highlight"> 
    <pre> 
    <!--<code class="language-html" data-lang="html">--> 
    <!-- your code here --> 
    <!--</code>--> 
    </pre> 
</figure>

CSS

.highlight { 
    padding: 9px 14px; 
    margin-bottom: 0; /* no margin-bottom */   
}

來源

2016-10-28 09:58:07 djl

感謝@djl建議，我已經找到了我需要添加replace('\n', '')我下面的腳本刪除無形的線斷

全部正在運行

<script type="text/javascript"> 
$('#preview-question').on('click', function (e) { 
    $.ajax({ 
     url: "<?php echo base_url('question/preview');?>", 
     type: 'POST', 
     data: { 
      title: $('#title').val(), 
      question: $('#question').val(), 
      '<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>' 
     }, 
     dataType: 'json', 
     success: function(response){ 
      if (response.success) { 
       $('#preview').html(response.question); 
       $('#preview pre br').remove(); 
       var str = $('#preview pre').html(); 
       $('#preview pre').html(str.replace(/</g, "&lt;").replace(/>/g, "&gt;").replace('\n', '')); 
       $('#preview pre').each(function(i, block) { 
        hljs.highlightBlock(block); 
       }); 
      } else { 

      } 
     } 

    }); 

    e.preventDefault(); 
}); 
</script>

來源

2016-10-28 10:45:57 user4419336

無法刪除保證金引導

回答

相關問題