Style with Grid-Images-Header

Allerlei Nützliches
Gesperrt
Benutzeravatar
Forum Member
Site Admin
Beiträge: 373
Registriert: 3. Apr 2019, 17:36
Vorname: Jutta
Dein Land: Schweiz
Wohnort: Zuchwil / SO
Kontaktdaten:

Style with Grid-Images-Header

Beitrag von Forum Member » 29. Jan 2020, 10:36

Wichtig: Das ist kein Style den man in einem Liveboard installieren kann! Er dient nur zu Demo Zwecken. Er ist nur als Anregung gedacht.

Important: This is not a style that you can install in a liveboard! It is for demo purposes only. It is only meant as a suggestion.

Inspired by this manual, I made another attempt today (all day :-) )
https://webdevtrick.com/css-rhombus-image-grid/

But it definitely does not seem to be possible with the rhombus images. The header would be much too high. Or then the images would not be nicely arranged.
The final problem was the link in the header image. Now with an Font Awesome icon. The only problem: you can't click in the middle of the icon. There must always be something beside it :) .

Result:
grid_image_header.jpg
Responsive is the header. But whether the hover images end up on the phone display is a matter for the gods. Even the stars know whether I have now done everything correctly. :lol:

Note: The one with the automatic size adjustment did not work either. All images must be exactly 500x300px. I guess because the images are inserted in the images folder of the style. Previously with the images linked in the manual, it worked with every size specification.

Edit: It seems to be displayed correctly in the phones. Only the distance at the bottom to the header border is a bit too big.
grid_image_header_responsive.jpg
with searchheader.jpg
But I doubt that this works with the extensions that are installed by the events before and after the search header.

Edit2: Seems to work too - but the picture should have max. 80px (here 70px). Which is why it certainly does not look good with the most ext.
rightimage.jpg
rightimage.jpg (23.77 KiB) 406 mal betrachtet
-----
FlowerPower_3.3.0_Images-Header.zip
(3.56 MiB) 6-mal heruntergeladen
Kein Support per PN und Email!
Be the best version of yourself rather than a bad copy of someone else!
The best online TranslatorMy forum

Gesperrt

Zurück zu „Für Style Ersteller“