修复溢出时没有最小高度

Question

我在here部分中尝试了所有方法来解决文本溢出问题。但是我不想使用min-height来修复它，因为我不知道最终的高度。任何指导将不胜感激！

Answer 1

您不希望使用// Requiring the dependencies const express = require('express'); const app = express(); const bodyParser = require('body-parser'); const cors = require('cors'); const mongoose = require('mongoose'); const PORT = process.env.PORT || 3001; const itemRoutes = express.Router(); let Comment = require('./comment.model'); require('env2')('../config.env') app.use(cors()); app.use(bodyParser.json()); mongoose.connect(DB_URL, { useNewUrlParser: true } ) const connection = mongoose.connection; connection.once('open', function() { console.log('Connection to MongoDB established succesfully!'); }); // Serve static assets if(process.env.NODE_ENV === 'production') { app.use(express.static('build')); } itemRoutes.route('/').get( async (req, res) => { let collection = connection.collection("posts"); let response = await collection.find({}) .toArray(); res.send(response); }); itemRoutes.route('/comments').get( async (req, res) => { let collection = connection.collection("comments"); let response = await collection.find({}) .toArray(); res.send(response); }); itemRoutes.route('/userComments') .post((req, res) => { res.setHeader('Content-Type', 'application/json'); let comment = new Comment(req.body); comment.save() .then(comment => { res.status(200).json({comment}) }) .catch(err => { res.status(400).send('failed') }) }); app.use('/', itemRoutes); app.use('/userComments', itemRoutes); app.listen(PORT, function() { console.log('Server is running on' + ' ' + PORT); }) ，因为您不知道将要使用的实际高度，但是您确实可以使用与bootstrap 4使用的值相同的min-height

（无需调用引导程序）

Answer 2

text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;

将其添加到家庭教学课程中

Answer 3

添加display：flex;和flex-direction：column; .home-hiw类的属性。

  .home-hiw {
    background: #E9E8E8;
    width: 100%;
    min-height: 600px;
    padding: 15px 0;
    margin-bottom: 15px;
    display: flex;           /*change dispay block to display flex */
    flex-direction:column;   /*add flex direction */
    position: relative;
    overflow: hidden;
}

我希望这是您的期望：