Servage Magazine

In this article we create the left side of the portfolio section. Start by creating another layer group and name it “Portfolio”. Select the rectangle tool and create a rectangle with the dimensions of 1400 by 596 pixels and name this layer  “Background”. Here the fill of the background layer is #f4f7f8. Portfolio quote from customer Select the Line tool and draw a line of 960 pixels by 1 pixel. Use the move tool and place it on the top of the portfolio section. Press shift and down key 4 times to set a margin of 40 pixels in between the horizontal line and top of this section. Select the line tool and draw a ...

Ever felt like your website isn’t the best version it could be? Do you find yourself wondering why your bounce rate is so close to 100%? Then it’s probably time to rethink your website design and the user experience your website is providing, because something is definitely not working out and it’s causing your visitors to run for the hills. Here are 5 reasons that might cause your visitors to leave your website in a rush and why you can’t seem to convert leads. Your website is not mobile friendly We get it: when you launched your website a long time ago, being mobile friendly was not the number one priority and you never ...

Centering content vertically and horizontally has been a troublesome subject for web developers in the past. Fortunately a new feature called Flexbox has been introduced in CSS3 to simplify the process of centering content. Flexbox allows developers to quickly and easily center content, usually divs or lists, vertically and horizontally with only a few lines of CSS. This article will walk through the most common properties of Flexbox and how to use them. Aligning to the center To start using Flexbox, an element must have its display property set to flex ("display: flex;"). This allows you to apply other Flexbox properties to the element. Flexbox is commonly used to align content horizontally. This ...

In this article, you will get an overview of how to add various plans for the services offered on the website. Box for "Basic Plan" Start by creating a new group and name the group “Plans”. Click on the rectangle tool and draw a rectangle of 1400 by 321 pixels. Use the Move tool to place the rectangular layer below the previous 4 column layer. Here, the colour #3ac162 has been used for the background of the section. Create two new groups inside the Plan group and name them Box 1 and Box 2. Inside box 1, create a rectangle layer by clicking on the rectangle tool. I have kept the dimensions of the rectangle to 300 by ...

When working with web applications you know the need for testing with sample data in your applications during development. This is extremely useful because testing with various sample data allows you to likely detect bugs you otherwise would have overlooked. Meaningful sample data also provides a useful way of showcasing the application for others, without having the typical manually entered John Doe entries over and over again. Laravel provides a tool to add sample data to your databases automatically. They call it database seeding. It is the processes of adding data to a database after migrations. You can create seeding scripts with PHP, so they can essentially include any logic you desire, to create ...

CSS preprocessors have become popular tools to ease and speed up the work of web designers. When looking at the latest web development trends, CSS preprocessors have gained enormous popularity in the past years, and the ability to use one is surely a benefit for developers and designers alike seeking a job. If you are not familiar with pre-processors such as Sass or Less, you may be wondering which one to start using. This article covers the differences and current popularity of Sass and Less to help you get started. What are Less and Sass? Before making a decision between which preprocessor to use, it is crucial to answer one question: what is a ...