search

benjaminkott / bootstrap_package

Bootstrap Package delivers a full configured theme for TYPO3, based on the Bootstrap CSS Framework.
https://www.bootstrap-package.com/
MIT License
336 stars 202 forks source link

Columns are displayed one above the other, but not side by side #799

Closed sputniklunar closed 4 years ago

sputniklunar commented 4 years ago

Hello,

I'm new in TYPO3 and Bootstrap Package and have a problem with each column layout. If I choose for example the Layout with a column left and create content for "left" and for "normal" it's not shown side by side, it's shown one above the other. So as if I would have created both in the section "normal". Upside is the content for left and under that is content for normal. I suppose it should be this way on the mobile version of the page, but it shows me in desktop page also. I have no idea why.

Here is a screenshot for "3 columns" where I created a title matching the position in the backend layout: 3columns

Backend looks like this: backend

gilbertsoft commented 4 years ago

Hi @kalinka2103 , looks like something is wrong with your template or style sheet. Have a look at the be log, there you will probably find a message about an error in your scss files...

sputniklunar commented 4 years ago

debug Hey @gilbertsoft , thanks for your quick reply! I checked the be log, but don't know if you mean the one I've checked (Backend -> System -> Log). It opens the Administration Log, which seems to be an user log, logging actions like editing pages or uploading files? I've set action to "errors", but no errors were displayed there. If I am in the frontend and enable the TYPO3 console on the edge of the window, it tells me "TypoScript 13 messages" and "Debug 0 Errors/Warnings". Did I look in the wrong places or the be log?

gilbertsoft commented 4 years ago

Yeah, System -> Log is the right place. Have you checked your style sheets are correctly included and accessible?

sputniklunar commented 4 years ago

Sorry for the stupid question, but how can I check this?

When I go to edit my template record, in the setup I only have: # Default PAGE object: page = PAGE page { bodyTag = <body> }

The constants are: page.logo.file = fileadmin/logos/logo.svg page.logo.height = 70 page.preloader.logo.file = fileadmin/logos/logo-white.svg page.preloader.backgroundColor = #AAAAAA page.preloader.fadeDuration = 0.5 page.preloader.logo.height = 150 plugin.bootstrap_package.settings.scss.primary = #e2001a page.theme.language.enable = 0

When I set up the primary color I could not edit it in the constant editor. When I saved my changes it always "resetted" to the default primary color (this happens with all color changes in that section). So I wrote it myself in the constant code editor with "plugin.boot.....". The other changes I did not had to write, I could simply edit in the constant editor.

Do I have to use something like this for Bootstrap Package (see below)? I don't know where the CSS is located, it's not in fileadmin. page.IncludeCSS = .....

gilbertsoft commented 4 years ago

Simply have a look at the source or dev tools in your browser grafik Each of this files listed on the left should show some content. The most important is the one I've opened in my screen shot

benjaminkott commented 4 years ago

@kalinka2103 this is probably related to one of these:

sputniklunar commented 4 years ago

@gilbertsoft I checked it with dev tolls and see adminpanel.css, bootstrappackageicon.min.css, merged-.... and webfont.css. The files are not empty.

benjaminkott commented 4 years ago

@kalinka2103 can you check https://www.whatismybrowser.com/ with the same browser you are having problems and share the link with us? Example: https://www.whatismybrowser.com/w/56NAMPX

sputniklunar commented 4 years ago

@benjaminkott I use Chrome on a Windows 10, Chrome on a MacOS and Safari on a MacOS. All have the same displaying. Here the link for the Windows-Chrome:

https://www.whatismybrowser.com/w/4W2FETY

benjaminkott commented 4 years ago

Can you please check if this example is rendering correctly? https://www.bootstrap-package.com/pages/3-columns

sputniklunar commented 4 years ago

Yes, it looks like this for me: 3colexample

benjaminkott commented 4 years ago

Ok, please remove the following from your TypoScript Setup, the CSS classes on the body tag are missing that are instructing the template to render correctly. This should resolve the issue.

# Default PAGE object:
page = PAGE
page {
bodyTag = <body>
}
sputniklunar commented 4 years ago

Oh dear… it absolutely worked. Thank you so much!

gilbertsoft commented 4 years ago

You're welcome!

benjaminkott commented 4 years ago

Perfekt!