#1

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

design Riga

Hallo zusammen,

hat vielleicht jemand einen Tipp, wo ich im Design Riga Änderungen vornehmen muss, damit die Klasse sqrtabactive bzw. sqrtabs eine größe von 1600px bekommt?

Ich habe in den style_content.css geschaut aber dort finde ich lediglich fongenden Eintrag:

.sqrtabs .sqrtabshead ul {
  box-sizing: border-box;
  padding: 0 30px;
  display: block;
  list-style: none;
  max-width: 1400px;
  margin: 0 auto;
  -webkit-user-select: none;
  user-select: none;

 

Hier noch ein Bild um mein Anliegen zu verdeutlichen:

sqrtabs_sqrtabactive.jpg

screenshot sqrtabs


Angezeigt wird ja eine größe von 1562 px Aber diesen Wert konnte ich in keiner CSS Datei finden (Ich vermute, dass dieser wert ja auch abhängig von der Bildschirmgröße ist?)

Evtl. müsste auch noch mehr angepasst werden, wie .sqrtabscontainer .sqrfwalt

 

Vielen Dank und schöne Grüße
Andreas


Dieser Beitrag wurde bereits 1 mal bearbeitet, zuletzt von »W2D Fan« (08.01.2018, 12:53)
#2

W2D Fan

Co-Admin  (2716 Punkte)  ·   weiblich  ·   Niederlande  ·    Nachricht senden
 http://www.w2dfan.nl

Zitat von: Andreas_B

Angezeigt wird ja eine größe von 1562 px Aber diesen Wert konnte ich in keiner CSS Datei finden (Ich vermute, dass dieser wert ja auch abhängig von der Bildschirmgröße ist?)

Falsch. Obwohl ich nicht sehr viel von responsive Designs verstehe ist den Maincontainer (worin das ganze Design aufgebaut wird) 1600px Breit. Dass bei dir die Tabs mit einer Breite von 1562px angezeigt werden liegt daran dass du keine Sidebar verwendest und es offensichtlich einen Padding von 19px links und rechts gibt. Den Wert habe ich nicht zurückfinden können aber kommt mir schon logisch vor.

Die von dir angegebene MAXIMALE Breite von 1400px bei einer minimale Bildschilmbreite von 1024px hängt m.M.n. damit zusammen dass ja auch noch eine Sidebar möglich sein muß falls eventuell später noch gewünscht.

Aber wie gesagt, ohne Sidebar wird schon die maximale Breite verwendet.

 

 


Gruß,
Marjorie

Hilfe ist nicht selbstverständlich, deshalb halte ich ein "Dankeschön" nachdem jemandem geholfen wurde für überaus angebracht und höflich.

Viele hier im Forum veröffentlichte Scripts sind das geistige Eigentum der Ersteller und unterliegen somit das Copyright! Wenn ihr diese Scripts in eure persönliche Seite(n) oder auf Seiten für eure Kunden anwendet, ist ein Quellverweis auf den Beitrag mit dem Script nichts anderes als selbstverständlich.

#3

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

Guten Morgen,

es kann nicht die maximale Breite sein, denn diese liegt bei 1600px. Somit ist deine Aussage falsch und nicht meine aber das ist haarspalterei.

Im Grunde bleibt meine Frage, wie ich die sqrtabactive bzw. sqrtabs auf 1600px bekomme.

#4

W2D Fan

Co-Admin  (2716 Punkte)  ·   weiblich  ·   Niederlande  ·    Nachricht senden
 http://www.w2dfan.nl

Tut mir leid Andreas, aber für die Berechnung braucht man nicht mal einen Kalkulator. Den maincontainer ist 1600px breit MINUS eine Margin von 20 px links und rechts in den content div, bleibt übrig für den Content 1560px!!!

Somit wird deine Registerkarte bei nicht nutzen der Sidebar auf die MAXIMALE Breite ausgegeben.

Du könntest also versuchen die Margin runter zu schrauben. Ob es davon schöner wird und andere Plugins/Absätze auch nicht darunter leiden.... Keine Ahnung, aber das sollst du dann selbst rausfinden.


Gruß,
Marjorie

Hilfe ist nicht selbstverständlich, deshalb halte ich ein "Dankeschön" nachdem jemandem geholfen wurde für überaus angebracht und höflich.

Viele hier im Forum veröffentlichte Scripts sind das geistige Eigentum der Ersteller und unterliegen somit das Copyright! Wenn ihr diese Scripts in eure persönliche Seite(n) oder auf Seiten für eure Kunden anwendet, ist ein Quellverweis auf den Beitrag mit dem Script nichts anderes als selbstverständlich.


Dieser Beitrag wurde bereits 1 mal bearbeitet, zuletzt von »W2D Fan« (08.01.2018, 10:02)
#5

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

Das der maincontainer die 1600px hat mir durchaus bewusst. (Der freundlichkeit halber nehme ich einfach mal an, dass wir an einander vorbei reden.)



Um meine Frage auch nochmals zu verdeutlichen, auf meiner Testseite:

Testseite Tab max 1600px hier sehen wir eine Registerkarte, innerhalb welcher sich mehrere Akkordeons befinden. Die Registerkarte nimmt die gesamte Breite des maincontainers, also 1600px, ein.


Testseite Tab != 1600px Hier sehen wir ein Akkordeon in welchem sich Registerkarten befinden. Die Registerkarten haben nicht die maximale Breite des maincontainers, also nicht 1600px.

Die Frage ist also weiterhin, wie man auch dieser Registerkarte die Breite von 1600px geben kann.

Oder auch:

Wie kann ich der Registerkarte, bei nicht nutzen der Sidebar, eine Breite von 1600px geben?

Oder anders gefragt, wie kann ich die registerkarte genau so groß machen, wie den maincontainer, nämlich 1600px?

#6

W2D Fan

Co-Admin  (2716 Punkte)  ·   weiblich  ·   Niederlande  ·    Nachricht senden
 http://www.w2dfan.nl

Dein Problem befindet sich offensichtlich irgendwo in diesen Beitrag. Den Beitrag wurde geschieben in eine Zeit dass es bei Siquando noch keine responsive Designs gab, ist also auch nicht mit einem responsive Design getestet.

Ob es irgendwie damit zusammenhängt weiß ich nicht, den Beitrag ist nicht von mir und ich verwende ihn nicht.


Gruß,
Marjorie

Hilfe ist nicht selbstverständlich, deshalb halte ich ein "Dankeschön" nachdem jemandem geholfen wurde für überaus angebracht und höflich.

Viele hier im Forum veröffentlichte Scripts sind das geistige Eigentum der Ersteller und unterliegen somit das Copyright! Wenn ihr diese Scripts in eure persönliche Seite(n) oder auf Seiten für eure Kunden anwendet, ist ein Quellverweis auf den Beitrag mit dem Script nichts anderes als selbstverständlich.

#7

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

 Das Script, bzw. die Möglichkeit Akkordeon und Tabreiter zu mischen erzeugt ja keine neuen Klassen für den Tabreiter, sondern nutzt die Vorhandenen.

Aber danke dir für deine Hilfe

#8

Sven aus Berlin

Forum-Sponsor  (397 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://www.svenrülke.berlin

 

Hallo Andreas,

Was Registerkarten sind weißt du? Registerkarten, nebeneinander. Registerkarten untereinander wären somit keine Registerkarten, sondern wären dann Accordeon. Und wie man die vergrößert zeig ich dir gerne auf. Damit dein Vorhaben funktioniert (Accordeon) zu vergrößern musst du folgende Änderungen vornehmen.

Öffne die style_content.css im Design Riga. Zeilennummern (Ausgehend vom Originaldesign unverändert).

Zeile 578 bis Zeile 5585:

Dort den Eintrag in Zeile 582: border-bottom: 1px solid <cc:print value="&site.properties.design.boxborder">; entfernen.

Dann in den Zeilenabschnitt 594 bis 605:

Den eben gelöschten Eintrag: border-bottom: 1px solid <cc:print value="&site.properties.design.boxborder">; hinzufügen. Am besten unter Zeile 598.

Dann im Zeilenabschnitt „@media screen and (max-widt: 767px)“ den Eintrag:

 .sqracc .sqracchead {
 margin: 0;
 padding: 0 30px;
 }

Löschen und durch:

 .sqracc .sqracchead {
 box-sizing: border-box;
 margin: 0 30px;
 padding: 0;
 border-bottom: 1px solid <cc:print value="&site.properties.design.boxborder">;
 -webkit-tap-highlight-color: transparent;
 cursor: pointer;
 }
 .sqracc .sqracchead div {
 padding: 10px 20px 10px 32px;
 border-top: 1px solid <cc:print value="&site.properties.design.boxborder">;
 border-left: 1px solid <cc:print value="&site.properties.design.boxborder">;
 border-right: 1px solid <cc:print value="&site.properties.design.boxborder">;
 border-bottom: 0px solid <cc:print value="&site.properties.design.boxborder">;
 cursor: inherit;
 float: left;
 background: #ffffff url(<cc:print value="&accclosed.svg.filename">) 10px 50% no-repeat;
 min-width: 30%;
 -webkit-user-select: none;
 user-select: none;
 }

Ergänzen.

Die Ergänzung habe ich neueingefügt, damit das border-bottom auch beim Skalieren richtig ausgegeben wird.

Bitte denk daran, dass du immer eine Sicherungskopie der zu bearbeitenden Datei anlegst. Das Ganze funktioniert mit oder ohne Sidebar.

Kurzer Hinweis für Marjorie „das Design Riga besitzt eine Sidebar!“ .


Spontaneität muss sorgfältig geplant werden.

tagebuch.svenrülke.berlin


Dieser Beitrag wurde bereits 1 mal bearbeitet, zuletzt von »Sven aus Berlin« (08.01.2018, 12:44)
#9

Sven aus Berlin

Forum-Sponsor  (397 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://www.svenrülke.berlin

#10

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

Hallo Sven,

vielen Dank für deinen ausführlichen Beitrag.


Klar weiß ich was Registerkarten und Akkodeons sind. Auf meiner Testseite habe ich da die ja lediglich gemischt, also ein Akkordeon, welches beim Aufklappen Registerkarten zeigt.

Und das Grundproblem ist wohl, dass die Registerkarten innerhalb eines Akkordeons nicht die gleiche Breite haben, wie Registerkarten, welche sich nicht in einem Akkordeon befinden.

Die Akkordeons werden ja durch ein Script erzeugt, welches es erlaubt innerhalb der Software Registerkarten und Tabreiter zu mischen. Darum weiß ich nicht genau, ob deine gute und ausführliche Antwort mir wirklich hilft bzw. das Problem trifft.

Meine Vermutung ist, dass es doch mit einer Klasse, welche zu dem Akkordeon Script gehört, zusammenhängt. Ich bin da gerade dran und melde mich wieder sobald ich was herausgefunden habe


Danke auf jeden Fall! 🙂

#11

Sven aus Berlin

Forum-Sponsor  (397 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://www.svenrülke.berlin

Ja ok Andreas.

Wenn ich dich richtig verstanden habe, möchtest du Akkordens mit Registerkarten mischen? Und wenn in Akkordeons Registerkarten sind, sollen die ebenfalls die Breite des Akkordeons haben?

Mh, ganz logisch ist es aus meiner Sicht und genannten Gründen jedenfalls nicht. Wie gesagt, Tabreiter sollen NEBENEINANDER ausgegeben werden und AKKORDEONS untereinander. Das macht dann auch sinn.

Okey, meld dich und sag mir ob das was ich hier postete #8 schon ein wenig weiter half.

 


Spontaneität muss sorgfältig geplant werden.

tagebuch.svenrülke.berlin

#12

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

Hab es gefunden 😃

Hatte auch von vorherein den falschen Ansatz. Es war tatsächlich die Klasse .inhalt von dem Akkordeon Script. Dort war ein padding enthalten, welches dazu geführt hat, dass nicht die maximale Breite des maincontainers verwendet wurde.
Angepasst und läuft 🙂 siehe Testseite fixed

 

Btw. @all ich arbeite momentan daran die Akkordeons aus dem Script responsive zu machen, zum Teil sind sie das schon aber noch nicht ganz gut. Wenn interesse besteht, und ich soweit damit fertig und zufrieden bin (was dauern kann) kann ich das im forum ja nochmal posten

#13

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

Hallo Sven,

nein, nicht ganz. Wie du auf meiner Testseite ja sehen kannst sind dort mehrere Akkordeons (diese sind natürlich uneinander angeordnet) welche beim aufklappen Registerkarten zeigen (diese sind dann nebeneinander).

Es ging lediglich um die Breite des Inhaltbereiches der Registerkarten. Diese waren, wenn die Registerkarten innerhalb eines Akkordeons sind (also durch aufklappen eines Akkordeons erst angezeigt werden) nicht so breit wie Registerkarten welche ganz normal (also ohne ein Akkordeon) eingebunden waren. Aber diese Differenz in der Breite, der eigentlich identischen Absätze, wurde durch die CSS Klasse .inhalt vom Akkordeon Script verursacht.

Es ist schon richtig, dass für die Registerkarte in beiden Fällen die gleichen Klassen genutzt werden aber wenn eine Registerkarte innerhalb eines Akkordeons ist, so greifen dort (selbstverständlich im nachhinein) auch noch die extra Klassen von dem Akkordeon Script.


Alles etwas kompliziert 😃


[Edit]
Ps.: Das Thema kann von meiner Seite her auf "Erledigt" gesetzt werden
[/Edit]


Dieser Beitrag wurde bereits 1 mal bearbeitet, zuletzt von »Andreas_B« (08.01.2018, 13:00)
#14

Sven aus Berlin

Forum-Sponsor  (397 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://www.svenrülke.berlin

Ah ja, jetzt verstehe ich. Vielleicht hättest du im ersten Post die besser beschreiben können, dann hätte man (Sven) besser und eher verstanden worauf die hinaus wolltest. Aber egal, schön, wenn du die passende Lösung selber gefunden hast.

Und deine Lösung kannst du ja dann wie von dir vorgeschlagen hier für alle Posten die vielleicht dann das selbe Interesse haben. Super Andreas! Danke!


Spontaneität muss sorgfältig geplant werden.

tagebuch.svenrülke.berlin

#15

Andreas_B

Forum-Sponsor  (116 Punkte)  ·   männlich  ·   Deutschland  ·    Nachricht senden
 http://undefined.bplaced.net

 stimmt, in meinem ersten post war mir das wohl selber noch nicht ganz klar 😞

Ja, das werde ich machen sobald ich so weit bin

und danke dir nochmal 🙂

168 Aufrufe | 15 Beiträge