CSS position fixed left and right double positioning implementation code
|
CSS Position The position property has five values:
Elements can be positioned using the top, bottom, left and right properties. However, these properties will not work unless the position property is set first. They also work differently, depending on the positioning method.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.box{
width: 1400px;
height: 1500px;
margin: 0 auto;
}
.box1{
border: 1px solid #000000;
height: 200px;
width: 200px;
display: inline-block;
position: fixed;
}
.box02{
border: 1px solid #006400;
height: 1500px;
width: 800px;
display: inline-block;
margin: 0 20px;
margin-left: 250px;
}
.box03{
border: 1px solid #006400;
height: 200px;
width: 200px;
display: inline-block;
position: fixed;
}
</style>
</head>
<body>
<div class="box">
<div class="box1">123</div>
<div class="box02">456</div>
<div class="box03">789</div>
</div>
</body>
</html>
This is the end of this article about the implementation code of CSS position fixed left and right double positioning. For more relevant CSS position fixed positioning content, please search 123WORDPRESS.COM’s previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future! |
<<: How to prevent Vue from flashing in small projects
>>: Implementation code of front-end HTML skin changing function
Recommend
Implementation of element multiple form validation
In the project, form testing is often encountered...
Use nginx.vim tool for syntax highlighting and formatting configuration nginx.conf file
I use tengine, the installation directory is /usr...
Docker Gitlab+Jenkins+Harbor builds a persistent platform operation
CI/CD Overview CI workflow design Git code versio...
How to use Lottie animation in React Native project
Lottie is an open source animation library for iO...
Example code for realizing charging effect of B station with css+svg
difficulty Two mask creation of svg graphics Firs...
VMware 15.5 version installation Windows_Server_2008_R2 system tutorial diagram
1. Create a new virtual machine from VMware 15.5 ...
Detailed explanation of SRIOV pass-through configuration and performance testing based on KVM
SRIOV introduction, VF pass-through configuration...
Basic usage of find_in_set function in mysql
Preface This is a new function I came across rece...
Detailed explanation of upgrading Python and installing pip under Linux
Linux version upgrade: 1. First, confirm that the...
Sample code for testing technology application based on Docker+Selenium Grid
Introduction to Selenium Grid Although some new f...
Analysis of the process of publishing and deploying Spring Boot applications through Docker
Table of contents Manual deployment 1. Create a s...
JS implements user registration interface function
This article example shares the specific code of ...
Example of using swiper plugin to implement carousel in Vue
Table of contents vue - Use swiper plugin to impl...
Solution to high CPU usage of Tomcat process
Table of contents Case Context switching overhead...
Solution to the problem of mysql master-slave switch canal
After configuring VIP, the error message that app...