Fixed Responsive Design for Mobile

This commit is contained in:
malik 2024-01-23 19:48:44 +01:00
parent 2b944f6223
commit 9ad9dc390f
8 changed files with 27 additions and 9 deletions

View file

@ -4,6 +4,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <link href="css/style.css" rel="stylesheet" /> <title>mawacode.de</title> <link href="css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -5,6 +5,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <title>mawacode.de</title>
<link href="../css/style.css" rel="stylesheet" /> <link href="../css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -3,8 +3,9 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <title>mawacode.de</title>
<link href="../css/style.css" rel="stylesheet" /> <link href="../css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -3,7 +3,9 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <link href="../css/style.css" rel="stylesheet" /> <title>mawacode.de</title>
<link href="../css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -3,8 +3,9 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <title>mawacode.de</title>
<link href="css/style.css" rel="stylesheet" /> <link href="css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -49,7 +49,7 @@ nav ul li{
nav ul li a{ nav ul li a{
color: black; color: black;
font-size: 14px; font-size: 100%;
padding: 5px; padding: 5px;
text-decoration: none; text-decoration: none;
background-color: #e2de84; background-color: #e2de84;
@ -102,7 +102,7 @@ h2{
margin: 5px; margin: 5px;
cursor: pointer; cursor: pointer;
background-color: #e2de84; background-color: #e2de84;
padding: 0.5%; padding: 5px;
box-shadow: 5px 5px 5px; box-shadow: 5px 5px 5px;
} }
@ -130,7 +130,7 @@ h2{
#aboutmelinks li a{ #aboutmelinks li a{
color: black; color: black;
font-size: 14px; font-size: 100%;
padding: 5px; padding: 5px;
text-decoration: none; text-decoration: none;
background-color: #e0d94c; background-color: #e0d94c;
@ -144,13 +144,13 @@ h2{
#catpics img{ #catpics img{
width: 100%; width: 100%;
margin: 20px; margin: 8px;
box-shadow: 10px 10px 10px; box-shadow: 10px 10px 10px;
} }
.technolist li{ .technolist li{
color: black; color: black;
font-size: 14px; font-size: 100%;
padding: 5px; padding: 5px;
margin: 10px; margin: 10px;
text-decoration: none; text-decoration: none;
@ -161,6 +161,11 @@ h2{
@media only screen and (max-width:900px){ @media only screen and (max-width:900px){
.container{
padding-left: 4%;
padding-right: 4%;
}
nav ul { nav ul {
width: 100%; width: 100%;
position: absolute; position: absolute;
@ -211,4 +216,8 @@ h2{
.col-1{ .col-1{
flex-basis: 100%; flex-basis: 100%;
} }
#aboutmelinks li{
margin: 5%;
}
} }

View file

@ -5,6 +5,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <title>mawacode.de</title>
<link href="css/style.css" rel="stylesheet" /> <link href="css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>

View file

@ -3,7 +3,9 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>mawacode.de</title> <link href="css/style.css" rel="stylesheet" /> <title>mawacode.de</title>
<link href="css/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <body>