there are two columns div, on the left is a list pulled back according to the background interface, and on the right is the content. If you want to set the height of two columns, my idea is to get the element height and set the height of two columns, but if you set it in the call interface, update the list, but the element height is not actually available, so there is no way to solve it, or can you set
:
this type of problem is called contour layout, and there are many solutions. I have one here: padding compensation method. First, set the padding-bottom of the column to a large enough value, and then set the margin-bottom of the column to a negative value offset by the positive value of the previous padding-bottom. The parent container is set to exceed the hidden value, so that the height of the child container is still the height of the column in which the padding-bottom is not set. When the height of any column in it increases, the height of the parent container is propped up to the height of the highest column in it. Other columns shorter than this column will use their padding-bottom to compensate for this height difference. Because the background can be used in the space occupied by the padding, and the border changes with the padding, a cover is successfully completed.
the height on the right is set to 100%
then the height of the parent element on the left and right is determined by the list on the left, code:
.par {
height: auto;
}
.right {
height: 100%;
}some special fonts are relatively large. I checked that a plugin called tarantula is very useful, but how do I use it in the vue project? after all, in the end, there is nothing in the html file from build, and it is useless to use font-spider. What shou...
1. The file structure directory is as follows: index.scss@importscssicon.scssfonts: main.jsindex.scss : ask the great god to help solve it? Compare heart to heart ...
execute a getAll method in an interval timer. This getAll method will read an interface using axios loop. Once the interface data changes, the new data will be written into vue.count. What I want to achieve now is that once the vue.count changes, th...
like this, find the train of thought ...
as the title the picture is as follows: how should this be solved? Vue-cli-based projects ...
the following figure shows that if you want to make a mouse slide over the picture, the mesh box moves along with the mouse. Encountered a very strange problem, figure 1 is normal, but when I move the mouse again, it becomes figure 2. If you move contin...
sass-loader,scss-loader,node-loader,webpack.base.conf.jsmodulerules for correction, thank you ...
common.scss is introduced globally in vue projects, and globally defined scss variables and mixin cannot be used in header components common.csss: $color_active:-sharp4381E6; header.vue: .cp_header{ background: $color_active; } ...
Hello, seniors. When I first tried to use the ele-ui component today, I found that the default style could not be modified. What s going on? for example, if I define this, I want to change the color of that commodity name . Why do I automatical...
the figure above is a circular table (using vue), one of the fields is probability, how to add background color to the corresponding row in the table according to the numerical value of probability? For example, the probability value is 50%, then I w...
in vue s mobile phone page, the input box is fixed at the bottom of the page through fixed. When the keyboard appears, it is topped by the keyboard, but if it slips down, the input box slides again. How to keep the input box motionless when sliding, and...
as shown in figure scss ...
<style lang="postcss" scoped> @import @pages job-manager create-job.css ; .left{ width:700px !important; } .vue-input-tag-wrapper{ line-height: 20px; border: 1px solid -sharpdddee1; border-radius: 4px !important; bo...
-webkit-box-orient: vertical; autoprefixer:on -webkit-line-clamp: 2; text-overflow: ellipsis; after packaging with vue, the style of multi-line omission does not take effect? ...
what to do with the gradual expansion of the search box when you click the icon. Expand from right to left ...
background picture of timing switching div implemented by my settimeout <div class="blur1x" :style="{backgroundImage: url( + currentImg[currentImgIndex - 1] + ) }" I want to add transition animation when switching. Ask th...
https: vue-loader.vuejs.org . the description of this address I read roughly means < style scoped > < style > the CCTV that the current style cannot cover the subcomponents is that the attribute data-v-xxxxx will not appear on the subcompone...
< H2 > error message < H2 > .Error processing file: static css app.712bea8dd803afc0084e16e3c16e5d53.css (node:5948) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): Error: Option safe was removed. Use parser: require (...
as shown in the title, trying sass-resources-loader cannot solve the problem of global introduction of postcss. Now I can only import global mixin functions into each vue component, which is very inconvenient. Is there any other way? ...
when using css module, the parent component suffixes the class selector of the child component style with the hash suffix, but the html tag is intact, causing the child component to reference no style effect for example, btn.vue is referenced in he...