Question

我的DIV大小有点问题。我需要创建一个div，左边是方形图像，右边是文本。主要问题是这是一个响应式网站，我不知道任何东西的最终大小......我需要图像的宽度和高度与文本的高度相同（Div是容器），他们需要自动更改...

我在尝试，但它不起作用：

HTML

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    concat: {
      options: {
        separator: "\n"
      },
      dist: {
        src: ['js/lib/*.js','js/main.js'],
        dest: 'js/script.js'
      }
    },
    sass: {
      dist: {
        options: {
          style: 'compressed'
        },
        files: {                                    // Dictionary of files
          'css/style.css': 'css/style.scss'         // 'destination': 'source'
        }
      }
    },
    uglify: {
      options: {
        sourceMap : true,
        mangle : false
      },
      my_target: {
        files: {
          'js/script.min.js': ['js/script.js']
        }
      }
    },
    watch: {
      css: {
        files: ['css/*.scss'],
        tasks: ['sass']
      },
      scripts: {
        files: ['js/lib/*.js','js/youtube.js','js/main.js'],
        tasks: ['concat', 'uglify']
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-watch');

  // Default task(s).
  grunt.registerTask('default', ['watch']);

};

CSS

<div id="barra">
    <div id="logosw">
        <img src="images/awa.png" alt="awa"/>
    </div>
    <div id="textsw">
        <p class="teli">Bala emerged on the market, with the goal of offering high quality services, for a competitive price. </p>
    </div>
</div>

我需要这样的东西：

#barra{
    float: left;
    margin-top: 0px;
    margin-bottom: 4%;
    width: 100%;
}

#logosw img{
    position: relative;
    float: left;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 4%;
    width: 20%;
    height: auto;
}

#textsw{
    float: right;
    width: 76%;
    margin-top: 0%;
    margin-bottom: 0%;
}

这样图像会改变它的大小，但它与文本高度完全相同...组合总是100％的页面宽度，图像和文本总是相同的高度..谢谢

Div，图像和文字高度

0 个答案: