• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Probleme mit der Logo ausrichtung

Gismo_74

Neues Mitglied
Hallo Zusammen

Ich habe bei Jimdo meine Geschäfts Hompage irgendwie zusammengebastelt.

Leider ist in der Standard Variante alles sehr unschön bei Jimdo. Mein Logo war viel zu gross !

Ich habe das Logo soweit verkleinert, das problem ist nun aber,dass sich der Text ab einer gewissen breite in das Logo hineinschiebt bevor es zur Responsiven Ansicht wechselt. nur wie behebe ich das ?
Logo schiebt sich in Text.JPG
 
habe hier mal das Script

<style type="text/css">
/*<![CDATA[*/
@media (max-width:768px){
/*Logo responsive*/
.jtpl-logo a img {
max-width:900px; !important;
margin-left:-90px !important;
margin-right:-90px !important;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (min-width:768px){
/*Logo Bildschirm*/
.jtpl-logo img {
width: 300px;!important;
margin-left: -5px !important;
position: absolute;!important;
height: 120px;!important;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (min-width:768px){
/*Logo Bildschirm*/
.j-website-title-content {
font-weight: normal;
font-style: normal;
color: #000;
font-family: "Roboto Slab",serif,"google";
font-size: 42px;
text-transform: none;
text-align: end;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (max-width:768px){
/*Logo responsive*/
.j-website-title-content {
font-weight: normal;
font-style: normal;
color: #000;
font-family: "Roboto Slab",serif,"google";
font-size: 45px;
text-transform: none;
text-align: center;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (min-width:768px){
/*Logo Bildschirm*/
.jtpl-title {
background: white;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.cc-imagewrapper img {
display: inline;
left: 1px;
max-width: 100%;
top: 30px;}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (min-width:768px){
/*Logo Bildschirm*/
.j-website-title-content {
line-height: 100px;}
/*]]>*/
</style>


<style>
/* <![CDATA[ */
.cc-product-variant-selectbox {
background-color: #F2F2F2 !important;
height:60px;
font-size:18px;
}
/*]]>*/
</style>


<style>
/* <![CDATA[ */
.j-product .cc-shop-product-desc .cc-shop-product-price-current {
color: #000000;
font-size: 32px;
line-height: 1em;
font-weight:bold ;
}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/

.j-hr hr {
border-style:solid;
border-color: #000000 ! important;
border-bottom-width: 1px;
border-style: solid;
}

/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
@media (max-width:768px){

.jtpl-main {
color: #212121;
font-family: "Open Sans",sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 2.5;


/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/


.jtpl-main {
color: #212121;
font-family: "Open Sans",sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 2.5;


/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.j-cart-hover-popup {
position: relative;
color: #fbfbfb;
background-color: #222;
background-color: rgba(247, 2, 2,);
-webkit-transition: all 100ms ease;
transition: all 100ms ease;
}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
#cc-checkout-steps .cc-checkout-steps-current {
opacity: 1;
background-color: #222;
background-color: rgb(251, 0, 0);
border-color: #222;
border-color: rgba(51,51,51,.85);
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.jtpl-navigation__label {
transition: left .3s;
border-bottom: 0;
cursor: pointer;
position: absolute;
padding: 17px;
text-align: center;
text-decoration: none;
top: 0;
background-color: rgb(247, 2, 2);
float: right;
z-index: 1000;
right: 0;
width: 26px;
height: 14px;
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/

.j-search {
border-style:solid;
border-width:1px;
color:#000000 !important;
border-color:#000000;
background:rgb(214,211,211);
}

/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.jtpl-cart .j-cart-icon {
background-color: rgba(247,2,2);
padding: .10em .9em;
}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.j-cart--hover-popup, .j-cart-icon {
position: relative;
color: #fbfbfb;
background-color: #7b7a7a;
background-color: rgba(247, 2, 2,);
-webkit-transition: all 100ms ease;
transition: all 100ms ease;
}
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.j-search .j-search-content input[type="text"].j-search-input {
padding-left: 40px !important;
border-color: #eee;
color: #000;
}

/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.content-options .j-comment textarea, .content-options .j-comment input[type="text"], .content-options .j-comment input[type="date"], .content-options .commententry textarea, .content-options .commententry input[type="text"], .content-options .commententry input[type="date"], .content-options .j-formnew .cc-m-form-view-sortable input[type="text"], .content-options .j-formnew .cc-m-form-view-sortable input[type="date"], .content-options .j-formnew .cc-m-form-view-sortable input[type="email"], .content-options .j-formnew .cc-m-form-view-sortable textarea, .content-options .j-formnew .cc-m-form-view-sortable select, .content-options .j-newsletterbox input[type="email"], .content-options #cc-checkout-gutter input[type="text"], .content-options #cc-checkout-gutter input[type="date"], .content-options #cc-checkout-gutter input[type="email"], .content-options #cc-checkout-gutter textarea, .content-options #cc-checkout-gutter select, .content-options .j-googlemaps .cc-map-route-start, .content-options .j-checkout__input-field {
border-color: #000;
color: #000;
/*]]>*/
</style>


<style type="text/css">
/*<![CDATA[*/
.cc-catalog-container-new .cc-catalog-galleryview.cc-catalog-st-3 .cc-product-title, .cc-catalog-container-new .cc-catalog-sliderview.cc-catalog-st-3 .cc-product-title {
margin-bottom: 45px;
text-align: center;

}
/*]]>*/
</style>




Klar hatt es in diesem Script noch fehler drinn, aber ich kenne mich mit CSS und HTML einfach nicht so aus. Deshalb habe ich auch ein Baukastensystem wie Jimdo gewählt. Von Jimdo selbst gibts leider keine hilfe, sobald man da ein eigenes layout verwendet.

Hoffe Ihr könnt mir da weiterhelfen oder einen typ geben wo der fehler liegt,dass es mir den Text ins Logo hinein schiebt. In der Responsiven Ansicht ( Smartphone ) da passt es ,nur halt eben in der Desktop Ansicht nicht.
 
Ich glaube nicht, dass du hier großartige Hilfe erwarten kannst, denn mit so einem Käse wie Jimdo beschätigt sich hier niemand ernsthaft.
 
Ohne das HTML kommt man auch nicht weit.
Die ganzen festen Werte Position: absolute/relative Margin:90px u. v. m. helfen dir für responsives Design auch nicht wirklich weiter.
Ich weiß nicht wie weit du bei Jimdo eigene CSS benutzen kannst usw. , aber Flexbox wäre hier der bessere weg.
Deine CSS die du gepostet hast , hat auch mehr Einträge als nötig
 
Zurück
Oben