Text verschieben

Hallo,

der Text auf meiner Homepage ist zu weit rechts und nachdem ich in meinem Theme die Sidebar gelöscht habe,
würde ich den Text nun zentrieren, so dass die Abstände nach links und rechts gleich sind.
Muss ich das in der Datei style.css machen oder geht das auch anders?

Vielen Dank im voraus für die Antworten

 

Ich hab das mit dem DevTool gemacht und mal den "Body" reingestellt.

element.style {

}






body {

• font-family: "PT Sans",Arial,Helvetica,sans-serif;
• font-size: 13px;
• margin: 0;
• padding: 0;
• background-color: #f7f7f7;
• color: #000000;
• width: 100%;

}

Gibt es kein Plugin, das einem eine ganz einfache Veränderung der Textabstände ermöglicht, so dass man innerhalb
kürzester Zeit die Texte nach rechts oder links schieben kann?

Es geht doch bestimmt vielen Usern so, das die Texte nicht an der gewünschten Stelle stehen.
Kann man nicht im Style.css ein paar Zahlen verändern und schon wird der gewünschte Abschnitt verschoben?

 

Ja die Grundlagen fehlen teilweise

Brauchst du den Link von der Homepage? Den möchte ich aktuell nicht öffentlich zugänglich machen.
Ich kann die style.css Datei hier einstellen und dann müsste man doch sehen, wo man was verändern muss, oder?

So wie ich das bisher verstanden habe, kann man doch alle möglichen optischen Veränderungen der Homepage in
der style.css Datei vornehmen??

 

Ich benutze das Theme Landshaft

 

Entschuldige das Thme heißt Landshafting.

Hier ist die Style.css Datei. Danke für eure Hilfe!

/*!
Theme Name: Landshafting
Description: Landshafting is a Fully Responsive WordPress Theme, a perfect choice for a gardening, lawn services, landscaping, agriculture, landscape website or blog. 100% Responsive, Customizable, and Easy to Use WordPress Theme.
Theme URI: https://ayatemplates.com/product/landshafting
Author: ayatemplates
Author URI: https://ayatemplates.com
Version: 1.0.6
Text Domain: landshafting
Tags: blog, food-and-drink, two-columns, right-sidebar, custom-background, custom-logo, custom-colors, custom-header, custom-menu, featured-images, post-formats, threaded-comments, editor-style, translation-ready, sticky-post, theme-options
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* general styles */
body {
font-family:"PT Sans",Arial,Helvetica,sans-serif;
font-size:13px;
margin:0;
padding:0;
background-color:#f7f7f7;
color:#000000;
width:100%;
}


#body-content-wrapper {
position:relative;
overflow:hidden;
}


input, select, textarea, button, #container .button {
font-family:inherit;
}


button {
cursorointer;
}


body:before {
content: none !important;
}


a {
text-decoration:none;
outline:none;
color:#656565;
}


a:hover {
color:#84c104;
}


a img{
outline:none;
}


p {
padding:3px 0 3px 0;
margin:0;
}


img {
border:0;
outline:0;
}


#main-content-wrapper img {
max-width:100%;
height:auto;
-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
}


#main-content-wrapper a:hover img {
-webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
opacity:0.7;
}


h1, h2, h3, h4, h5, h6{
font-weight:400;
margin:0;
color:#000000;
}

h1 {
font-size:24px;
padding:10px 0 3px 0;
}


h2 {
font-size:22px;
padding:5px 0 0 0;
}


h3 {
font-size:20px;
padding:8px 0 5px 0;
}


h4 {
font-size:18px;
padding:2px 0 1px 0;
}


h5 {
font-size:16px;
padding:2px 0 1px 0;
}


h6 {
font-size:14px;
padding:2px 0 1px 0;
}


table {
border-collapse: collapse;
}


td, th {
padding:10px;
}


#wp-calendar,
#wp-calendar th,
#wp-calendar td {
border:none;
}


#wp-calendar td,
#wp-calendar th {
padding:0;
}


embed,
iframe,
object,
video {
margin-bottom: 24px;
max-width: 100%;
}


p > embed,
p > iframe,
p > object,
span > embed,
span > iframe,
span > object {
margin-bottom: 0;
}


#sidebar select{
max-width:95%;
}


.gallery-item .gallery-icon > a:before,
dt.gallery-icon > a:before,
dt.gallery-icon > a:before,
.gallery-item .gallery-icon:before {
content:'' !important;
}


.gallery-item .gallery-icon > a,
dt.gallery-icon > a,
dt.gallery-icon > a,
.gallery-item .gallery-icon {
background:none;
}


#header-content-wrapper {
text-align: center;
}


#header-logo {
display:inline-block;
}


#header-logo > a.custom-logo-link,
#header-logo #site-identity {
float:left;
}


#header-logo h1 {
padding:0;
}


#navmain li {
padding:0;
}


ul > li {
padding:3px 0;
margin:0;
list-style-type:none;
}


ol > li {
padding:3px 0;
margin:0;
}


ol {
padding:0 0 0 30px;
}


ul {
padding:0 0 0 15px;
}


.widget > ul,


#sidebar > ul {
padding-left:0;
}


/* header */
#header-main-fixed {
clear:both;
background-color:#e3fc57;
margin:0;
width:100%;
color:#000000;
border-bottom:1px solid #d5d5d5;
}


#header-main-fixed a h1,
#header-main-fixed a {
color:#656565;
}


#header-main-fixed a:hover {
color:#639200;
}


#header-content-wrapper {
padding:0 2% 0 2%;
}


.item-arrow-down:after,
.item-arrow-up:after {
font-family:'FontAwesome';
font-size:12px;
}


.item-arrow-down:after {
content:"\f107";
}


.item-arrow-up:after {
content:"\f106";
}


#navmain {
margin:0;
clear:both;
float:none;
}


#navmain ul {
text-align: left;
}


#navmain > div > ul > .current-menu-item > a, #navmain > div > ul > .current-menu-ancestor > a,
#navmain > div > ul > li > a:hover {
color:#656565;
}


#navmain a:hover {
text-decoration:none;
}


article,
aside {
-ms-word-wrap: break-word;
word-wrap: break-word;
}


/* main content */
#main-content,
#container {
overflow:hidden;
padding:10px 0 0 0;
}


#main-content > article:first-of-type h1 {
margin-top:0;
padding-top:0;
}


/* sidebar */
#sidebar {
overflow:hidden;
padding:10px 0 0 0;
}


#sidebar ul:not(.social-widget) > li:before,
article ul > li:before {
content:"\f105";
font-family:'FontAwesome';
display:inline-block;
margin:0 5px 0px 1px;
opacity:0.7;
}


#sidebar > ul {
margin-left:3px;
}


#sidebar .widget {
margin-bottom:5px;
clear: both;
}


#infoTxt {
padding:10px 0 10px 0;
}


article ul > li:before {
font-family:'FontAwesome';
content:"\f105";
display:inline-block;
text-align:center;
margin:0 7px 7px 0;
}


article {
clear:both;
}


.separator {
}


#copyright {
clear:both;
text-align:center;
}


input[type="text"],
input[type="email"],
input[type="url"],
textarea {
border:1px solid #B2AEA3;
padding:4px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
-ms-border-radius:3px;
-o-border-radius:3px;
border-radius:3px;
}


input[type="submit"],
button {
font-size:14px;
}


input[type="submit"],
button,
.btn,
#container .button {
padding:8px 12px;
text-decoration:none;
font-weight:normal;
border:none;
color:#ffffff;
background-image: -ms-linear-gradient(top, #FFF000 0%, #639200 100%);
background-image: -moz-linear-gradient(top, #FFF000 0%, #639200 100%);
background-image: -o-linear-gradient(top, #FFF000 0%, #639200 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFF000), color-stop(1, #639200));
background-image: -webkit-linear-gradient(top, #FFF000 0%, #639200 100%);
filter: progidXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFF000', endColorstr='#639200');
background-image: linear-gradient(top, #FFF000 0%, #639200 100%);
text-shadow:0 !important;
-webkit-border-radius:3px;
-moz-border-radius:3px;
-ms-border-radius:3px;
-o-border-radius:3px;
border-radius:3px;
}


input[type="submit"]:hover,
button:hover,
#container .button:hover,
.btn:hover {
color:#ffffff;
background-image: -ms-linear-gradient(top, #639200 0%, #FFF000 100%);
background-image: -moz-linear-gradient(top, #639200 0%, #FFF000 100%);
background-image: -o-linear-gradient(top, #639200 0%, #FFF000 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #639200), color-stop(1, #FFF000));
background-image: -webkit-linear-gradient(top, #639200 0%, #FFF000 100%);
filter: progidXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#639200', endColorstr='#FFF000');
background-image: linear-gradient(top, #639200 0%, #FFF000 100%);
text-decoration:none;
}


.btn {
margin-top:10px;
display:inline-block;
}


#respond {
clear:both;
}


blockquote:before,
q:before {
font-family:'FontAwesome';
content: "\f10d";
color:#DEDEDE;
font-size:36px;
float:left;
margin:0 1% 0 0;
}


blockquote, figure {
margin:0 1%;
}


.page-links, .post-links {
padding:10px 0 3px 0;
margin:0;
}






.navigation .current,
.navigation .page-dots,
.navigation .page-numbers {
font-size:16px;
text-align:center;
display:inline-block;
float:left;
}


.navigation .page-dots,
.navigation .page-numbers {
padding:5px 11px;
border:1px solid #dddddd;
margin-right:10px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
-ms-border-radius:3px;
-o-border-radius:3px;
border-radius:3px;
}


.navigation .current,
.navigation .current:hover {
text-decoration:none;
background:#dddddd !important;
text-align:center;
margin-right:10px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
-ms-border-radius:3px;
-o-border-radius:3px;
border-radius:3px;
}


.navigation .page-numbers:hover {
text-decoration:none;
background:#fafafa;
text-align:center;
}

 

Hallo,

entschuldige ich meine das Theme Landshafting.

Kann ich den Text auch mithilfe der DevTools im Browser probeverschieben und dann an der geeigneten Stelle
im Editor formatieren?

 

Hi Edi,

ich würde ja auch gerne erstmal die Theorie verstehen wie man ganz im allgemeinen vorgeht, um bestimmte Dinge
zu verändern. Habt bitte Verständnis, dass ich den Link aktuell nicht reinstelle. Bin da ein bißchen paranoid :shock:

Es gibt doch bestimmt immer den selben Code zur Verschiebung von beispielsweise Texten sowie man bei dem Zeilenabstand
auch immer die line-height mit einer bestimmten Zahl angeben muss.

Wie gehst du normalerweise bei solchen Dingen vor, wenn du bestimmte Dinge an einer Internetseite verändern möchtest?

 

Aber die Vorgehensweisen und Formatierungs-Befehle (CSS), die sind doch immer gleich, oder? Das heißt, wenn ich beispielsweise die Schriftart ändern möchte, dann gehe ich eigentlich immer in den Body und gibt dort die gewünschte Schriftart ein. Gilt das nicht auch für Textverschiebungen, Bearbeitung von
Sitebars etc., so dass man eine Art Checkbuch hat, das fast immer gleich abgearbeitet wird?

Danke für eure Hilfe, trotz der laienhaften Fragen

 

Kann ich über die Entwicklertools im Browser alle Design-Einstellungen vorher ausprobieren, so dass ich weiß, was zu wem gehört und
mit welchen Hebeln ich die gewünschte Dinge verstellen kann?

Ist es möglich außer die Standard-Formatierung aus dem Body wie Schriftart, -farbe... auch das Menü mit den Reitern von der Größe und Farbe her
zu verstellen?

 

Ich weiß, dass sind alles sehr spezifische Fragen. Das Problem ist bloß, dass ich nicht genug Zeit habe, um mich voll in das Thema einzuarbeiten.
Ich möchte relativ zügig eine Seite konzipieren, die nicht unbedingt sehr viele Funktionen hat, aber vom Design her ansprechend ist.
Also alles sehr spartanische gehalten, aber mit klarer Navigation.

Dazu benötige ich: 1) Die Anpassung des Menüs = Veränderung der Farbe, Größe...
2) Einfügen von Tabellen, Bildern, Icons
3) Kleine Formatierungen wie Linkfarbe...

Die Webseite soll keinesfalls bis ins Detail professionell sein, daher dachte ich, dass ich die jeweiligen Probleme hier einigermaßen klären könnte.