[Pro] Unwanted padding/margin

Freeway
1

Hi,

I have a trouble with an HTML item that has flexible height and contains just one Markup Item with WOW Slider showcase. The HTML has no padding or margin set, but I am still getting few pixels of padding from the top and even more pixels from the bottom (see my example, where I applied red background to the html item).

There is the Auto Celarfix action applied to the page and when I disable it, the padding dissapears, but there is margin instead of it (i.e. a line of the grey background between the slideshow and the white DIVs with text). So this doesn’t help.

Is it possible to make the html item with flexible height that equals exactly the height of the markup item?

Thank you for any advice
Martin

http://akademiearchitektury.cz/test/Skoly/Plasy/testpage.html

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

2

I will tell you that I think your wowslider style code is full of nonsense. So much so, that I cannot even tell of its origins. Perhaps you have been adding to it in an attempt to fix your issue, or perhaps it is flawed from the start. I am not a wow slider user-- so I’m not sure what to expect-- but there is both inline style code and external style sheet code that is contradictory and unnecessary.

Fixing your problem, however, is not hard. There are two specific sources which create the space you are having trouble with.

First, there is a margin style applied to the item #wowslider-container7 in the stylesheet style.css…

margin:5px auto 12.5px;

This is shorthand for

margin-top: 5px;
margin-left: auto; 
margin-right: auto; 
margin-bottom: 12.5px

This should be replaced with

margin: 0;

However, there is still something within the #wowslider-container7 which is adding margin to the bottom: it is a paragraph tag wrapping your wow slider html code. The browser sees this as bad or malformed code and shifts the p tag to the bottom of the container where, although empty, still has a margin.

Freeway has a nasty habit of wrapping inline Markup Items in either paragraph tags or span class style tags. Or both. I would like to publicly take this opportunity to encourage Softpress to rethink this strategy. Wrapping inserted code with more code is indefensible and in these cases counterproductive.

This is what I think happened in your case-- you inserted your wow slider code via an inline markup item and Freeway infected it with poorly advised p tags. Since Freeway is doing this “automagically”, how may we counter it?

Download Remove Paragraph Tags action by Tim Plumb

This action has been around since Freeway 3 or 3.5-- so, a decade?! Applied to a container, like #wowslider-container7 and all the Freeway generated paragraph tags are removed on output, thus solving your Freeway-generated problem.

As to the rest of the style problems, I don’t know what to say. If you’ve added all that position and max-width, max-height nonsense, then I’d say go back to a vanilla installation of the slider. If wowslider is adding that, then maybe I’d reconsider its use.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

3

Is it possible to make the html item with flexible height that equals exactly the height of the markup item?

It is - however it is difficult (for me) to communicate:

####1. The MarkUP code

Preferably use the CrowBar-Item action (applied to the #SlideshowWrapper) to add external code. Thus avoids wrapping paragraphs around the MarkUp (code). Find this action on the Forge.

####2. Redundant code snippets

There is an engine 7 and 8 applied. Delete at least the 8, as long as you only need one.

####3. CSS coming from external stuff

For this, an external editor is required. I’m using Brackets, but there are many others out there. Heading to the style.css, open it and you’ll find an item called:

#wowslider-container7 {
display: table;
zoom: 1;
position: relative;
width: 100%;
max-width: 100%;
max-height:778px;
margin:0px auto 0px;
z-index:90;
text-align:left; /* reset align=center /
font-size: 10px;
text-shadow: none; / fix some user styles */

/* reset box-sizing (to boostrap friendly) */
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;

There is a property “margin”, which you should set as the above.

Doing so I got rid of those unwanted spaces:

Cheers

Thomas

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

4

Ha - Ernie you beat me for seconds.

Cheers

Thomas

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

5

Ernie, Thomas,
thank you, replacing the markup with crowbar and fixing the CSS code solved the problem.

Sorry for the redundant bits of the code, I forgot to delete the engine 8 from the HTML Markup. Anyway, I didn’t change the stylesheet before, so all the code in it was added by the wowslider…

Martin

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options