A PHP Error was encountered
Severity: Notice
Message: Undefined index: userid
Filename: views/question.php
Line Number: 191
Backtrace:
File: /var/www/html/cnasolution/application/views/question.php
Line: 191
Function: _error_handler
File: /var/www/html/cnasolution/application/controllers/Questions.php
Line: 419
Function: view
File: /var/www/html/cnasolution/index.php
Line: 315
Function: require_once
When I minimize the browser screen to the smallest, two section on my website come over each other (Services and Features)
I have created this web page using html, CSS and bootstrap, everything is okay on large and medium screen, but when I minimize to small screen (col-12 and col-sm-12) the features and services sections blend, I tried everything I don't know how to fix it.
here is some code, I hope it is clear for you guys:
* { padding: 0; margin: 0; font-family: "Lucida Fax", sans-serif; } body { overflow-x: hidden; } .header .content-box { background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(img/Webz.jpeg); background-position: center; background-size: cover; width: 100%; height: 100vh; } .menu { display: inline-flex; } .menu button { width: 75px; height: 35px; } .menu img { width: 147px; height: 147px; cursor: pointer; margin-top: 1px; } .menu button { background: #ff4d73; font-size: 16px; color: #fff; border: 0; position: absolute; right: 70px; top: 40px; cursor: pointer; } .menu button .fa { margin-right: 7px; } .banner-text { color: whitesmoke; margin: 14%; text-align: center; } .banner-text h2 { font-size: 37px; } .banner-text p { font-size: 15px; margin: 25px; } .banner-text a { border: 1px solid #ff4d73; padding: 7px; color: white; text-decoration: none; display: block; width: 100px; margin: auto; background: #ff4d73; transition: .70s; } .banner-text a:hover { background: transparent; } .service .content-box { background: whitesmoke; width: 100%; height: 100vh; } h1 { text-align: center; padding-top: 100px; } .service h1::after { content: ''; background: #ff4d73; display: block; height: 3px; width: 190px; margin: 21px auto 50px; } .services .icon { font-size: 37px; margin: 21px auto; height: 55px; width: 55px; border: 1px solid #ff4d73; border-radius: 50%; color: #ff4d73; } .services p { font-size: 12px; margin-top: 10px; color: #777; padding: 20px; } .services span { color: #ff4d73; } h3 { font-size: medium; } .services .col-md-3:hover { background: #ff4d73; cursor: pointer; color: #fff; box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.4); transition: 0.5s; } .services .col-md-3:hover p { color: #fff; } .services .col-md-3:hover span { color: #fff; } .services .col-md-3:hover .icon { border: 1px solid #fff; color: #fff; } li { padding-left: 35px; } .features .content-box { background: white; width: 100%; height: 100vh; } .features h2 { margin: 49px; padding-top: 111px; } .features h2::after { content: ''; background: #ff4d73; display: block; height: 3px; width: 150px; margin: 13px 7px 51px; } .features ul { margin-left: 5px; margin-top: 33px; list-style-type: none; } .features ul li { position: relative; line-height: 33px; font-size: 13px; } .features ul li::before { content: ''; height: 7px; width: 7px; background: #ff4d73; transform: rotate(45deg); margin-right: 19px; display: inline-block; } img { height: 57%; width: 85%; margin-top: 29%; } .footer .content-box { background: whitesmoke; width: 100%; height: 100vh; } .footer h1::after { content: ''; background: #ff4d73; display: block; height: 3px; width: 190px; margin: 21px auto 50px; } .form-control { margin: 17px; border-radius: 0 !important; border: none !important; box-shadow: none !important; } ::placeholder { font-size: 12px; } .contact-form button { border: none !important; background: #ff4d73 !important; box-shadow: none !important; border-radius: 0; margin-left: 27px; } .contact-info .follow { background-color: #fff; padding: 8px; margin: 11px; } .contact-info .fa { margin: 10px; padding-right: 20px; font-size: 20px; font-weight: bold; color: #ff4d73 !important; } .copyright { text-align: center; font-size: 15px; } .fa-heart-o { color: red; font-size: 17px; } .footer hr { margin-top: 217px; background: #ff4d73; } .form-group label { display: block; } .features { position: relative; top: 100%; }
Document Our Services
Brand Activation
Subscribe to our Youtube channel to watch more videos on web development, UI design, photoshop and Digital marketing. Don't forget to press the bell icon and never miss any new video
Employee Activity
Subscribe to our Youtube channel to watch more videos on web development, UI design, photoshop and Digital marketing. Don't forget to press the bell icon and never miss any new video
Event Organizer
Subscribe to our Youtube channel to watch nmore videos on web development, UI design, photoshop and Digital marketing. Don't forget to press the bell icon and never miss any new video
Video Production
Subscribe to our Youtube channel to watch nmore videos on web development, UI design, photoshop and Digital marketing. Don't forget to press the bell icon and never miss any new video
Features Are
- Some Text Some Text Some Text Some Text.
- Some Text Some Text Some Text Some Text.
- Some Text Some Text Some Text Some Text Some Text.
- Some Text Some Text Some Text Some Text Some Text.
- Some Text Some Text Some Text Some Text.