What is going on with my first block?
Permalink
Running 5.6.3.3.
Blocks are all styled "box" through the design editor and have the following code:
They are all added to the theme using this HTML (also included the bootstrap divs above):
This is just preview mode, and then all of the "Villas" boxes move up once it is no longer in preview. However...our little gold button friend, the very first one, will not move up even upon styling the design box css (top as a negative value).
CTA 2 and 3, interestingly enough, keep that white background even if the text is deleted (though, it should, I suppose, since it's coded into the CSS to have a white background). Here's that CSS:
I'm super stuck here guys. Any suggestions? I think it has something to do with the clearfix but upon adding another clearfix before CTA 2 it went away.
Blocks are all styled "box" through the design editor and have the following code:
.box { text-align: center; position:relative; height: 235px; width: 235px; top: -306px; margin: 40px; background-color: #fff; padding:10px 30px 30px 30px;
They are all added to the theme using this HTML (also included the bootstrap divs above):
<div id="content" class="row"> <div id="ctas"> <div class="col-xs-12 col-sm-4 hidden-xs"> <div id="cta"> <?php $a = new Area('CTA 1'); $a->display($c); ?> </div> </div> <div class="col-xs-12 col-sm-4 hidden-xs" > <div id="cta"> <?php $a = new Area('CTA 2'); $a->display($c); ?> </div> </div> <div class="col-xs-12 col-sm-4 hidden-xs"> <div id="cta"> <?php $a = new Area('CTA 3'); $a->display($c); ?>
Viewing 15 lines of 34 lines. View entire code block.
This is just preview mode, and then all of the "Villas" boxes move up once it is no longer in preview. However...our little gold button friend, the very first one, will not move up even upon styling the design box css (top as a negative value).
CTA 2 and 3, interestingly enough, keep that white background even if the text is deleted (though, it should, I suppose, since it's coded into the CSS to have a white background). Here's that CSS:
/**wrapper for entire div**/ #ctas { display: block; overflow: hidden; padding: 0; margin: 0 20px; } /**each individual**/ #cta { position: relative; display: block; margin: 0; padding: 0; cursor: pointer; height: 478px;
Viewing 15 lines of 17 lines. View entire code block.
I'm super stuck here guys. Any suggestions? I think it has something to do with the clearfix but upon adding another clearfix before CTA 2 it went away.
I'm not sure if the HTML you posted is exactly what you are using but it's missing a closing < /div >
Fixed it (closed out the div id="ctas").
also changed all of the cta IDs to classes.
Only thing the HTML Validator is giving me is no doctype and title now, which, yeah, of course there's not right now.
Still not working, though. Same place.
also changed all of the cta IDs to classes.
Only thing the HTML Validator is giving me is no doctype and title now, which, yeah, of course there's not right now.
Still not working, though. Same place.
The .box css code you posted is missing a closing } so I would check that as well.
I use Notepad++ to edit HTML because it highlights pairs of tags and pairs of brackets so I can see if something's missing. The color-coding in the Notepadd++ editor also changes if there is something missing like a missing quote. Other editors do this but Notepadd++ is free and works really well.
I use Notepad++ to edit HTML because it highlights pairs of tags and pairs of brackets so I can see if something's missing. The color-coding in the Notepadd++ editor also changes if there is something missing like a missing quote. Other editors do this but Notepadd++ is free and works really well.
I think I just neglected to copy that much - box css has its closing tag on
my editor. My company uses webstorm to edit but I might download notepadd++
as a double checker.
my editor. My company uses webstorm to edit but I might download notepadd++
as a double checker.
Is there a live URL where we could check this out? It's very tough to suggest things without seeing it in my browser where I can test solutions in real time.
The biggest issue I have is within the editor - but the site is
http://www.wilderness.vemglobal.net/index.php....
http://www.wilderness.vemglobal.net/index.php....
There are lots of support files files that are not found. See attached
Added.
You might want to consider rewriting your markup to something easier to maintain and to achieve the effect you want.
Right now you are trying to align an element within another element, which is not a parent but a sibling, using top positioning.
It's going to be a nightmare as soon as the screen size changes.
Right now you are trying to align an element within another element, which is not a parent but a sibling, using top positioning.
It's going to be a nightmare as soon as the screen size changes.
I had considered doing that - so I did, which makes sense syntactically.
The real issue here was this: concrete5 already has a class named box that
it names something else, so even when I deleted the content of the buttons
the white box was still showing up and was being called twice - that's why
it was so high.
I guess I need to be more creative with my naming!
The real issue here was this: concrete5 already has a class named box that
it names something else, so even when I deleted the content of the buttons
the white box was still showing up and was being called twice - that's why
it was so high.
I guess I need to be more creative with my naming!