Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Exit
kineticcreative123
Contributor
kineticcreative123
Contributor
Activity
‎Feb 16, 2018
08:55 AM
Hey everyone, | am working on an email and I'm having the usual outlook headaches. Code renders pretty decent in other clients. Here are my issues: 1) Background image is missing in Outlook (of course) . I tried bulletproof background images but it isn't working. 2) It seems my yellow background is taking on the style of my button and the button is loosing the style. (Should the button styles be in the head rather than inline?) 3) The logo at the bottom is taking on the button style in it's table and the button has lost the style. I've attached two screenshots. One of it rendering correctly in certain clients and one showing the issues I'm having. The html is below... Thank you in advance for any advice. <!DOCTYPE html> <html> <head> <title>Premier Executive Review</title> <!-- Custom Theme files --> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="keywords" content="Cool Berg Newsletter templates, Email Templates, Newsletters, Marketing templates, Advertising templates, free Newsletter" /> <style> /*! CSS Used from: Embedded */ body{width:100%;background-color:#cccccc;margin:0;padding:0;-webkit-font-smoothing:antialiased;} html{width:100%;} table{font-size:14px;border:0;} @media only screen and (max-width: 768px){ .container{width:650px;} .container-middle{width:416px!important;} } @media only screen and (max-width: 622px){ .container{width:500px!important;} .container-middle{width:416px!important;} .mainContent{width:216px!important;} } @media only screen and (max-width: 480px){ .container{width:160px!important;} } @media only screen and (max-width: 479px){ .top-header-left{width:260px!important;text-align:center!important;} .container{width:290px!important;} .container-middle{width:260px!important;} .mainContent{width:222px!important;} table{width:100%!important;} } @media only screen and (max-width:320px){ .ban{background:url(file:///Volumes/Macintosh%20HD/Emails/Exec%20Communications/Executive%20Review%20Email/images/banner.jpg) no-repeat -260px 0px;background-size:cover;} span.h-title{font-size:18px!important;line-height:1.8em!important;} span.para{font-size:0.9em!important;line-height:1.8em;} tr.ban{width:100%!important;height:256px!important;} } /*! CSS Used from: Embedded */ #footer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;background-color:#666666;padding:30px 60px;} @media screen and (max-width: 768px){ #footer{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;} } .social_icons{display:-webkit-box;display:-ms-flexbox;display:flex;} @media screen and (max-width: 768px){ .social_icons{margin:15px 0 0 0;} } .social_icons div{margin:0 0 0 5px;} #logo{width:216px;height:46px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/logo_1.png);} #twiterr_icon{width:35px;height:35px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/twiterr_icon.png);} #linkedin_icon{width:35px;height:35px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/linkedin_icon.png);} #insta_icon{width:35px;height:35px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/insta_icon.png);} #youtube_icon{width:35px;height:35px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/youtube_icon.png);} #fb_icon{width:35px;height:35px;background:url(http://offers.premierinc.com/rs/381-NBB-525/images/fb_icon.png);}</style> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr bgcolor="00000"> <td width="100%" align="center" valign="top" bgcolor="cccccc"> <!-- main content --> <table width="700" border="0" cellpadding="0" cellspacing="0" align="center" class="container top-header-left" bgcolor="00000"> <!-- Header --> <tr style="background:url(http://offers.premierinc.com/rs/381-NBB-525/images/building.jpg) no-repeat 0px 0px; background-size:cover;" height="300" class="ban"> <td> <table border="0" width="650" align="center" cellpadding="0" cellspacing="0" class="container-middle"> <tr><td height="30"></td></tr> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="mainContent"> <tr align="center"><img style="margin:0 auto;display:block;margin-top:15px;margin-bottom:30px;" src="http://offers.premierinc.com/rs/381-NBB-525/images/logo_1.png" alt="LineItemDetails" height="46" width="216"> <hr style="width:73%;"><td style="padding:0px 0;"><span class="h-title" style="color:#fff;font-family: 'Roboto Slab'; font-size:57px;font-weight:300;line-height:1em;text-align:center;text-decoration:none;">Executive Review </span><hr style="width:80%;margin-top:15px;"></td> </tr> <tr> <td align="center" style="color:#ffffff; font-family: 'Roboto Slab'; font-size:16px;margin-bottom: 15px;" data-color="header small text" data-size="header small text" data-min="15" data-max="18"> <span class="para"> Insite. Spotlight. Engagement. </span><hr style="width:80%;"> </td> </tr> </table> </td> </tr> </tbody> </table> </td> </tr> <tr><td height="22"></td></tr> </table> </td> </tr> <!-- second box--> <tr> <td bgcolor="ffffff"> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="mainContent"> <tr> <td height="30"></td> </tr> <tr align="center"> <td style="padding:10px 0;"><span class="h-title" style="color:#333333;font-family:Arial;font-size:30px;font-weight:600;line-height:1em;text-align:center;text-decoration:none;">Executive Leadership Track </span></td> </tr> <tr> <td align="center" style="color:#333333; font-family:Arial;font-size:16px;margin-bottom: 15px;line-height:1.5em;" data-color="header small text" data-size="header small text" data-min="15" data-max="18"> <div style="text-align: center;"> <a style="margin-top:15px;margin-bottom:20px;padding:5px 26px 5px 26px;background-color:#transparent;border: 2px solid #ffc627;border-radius: 7px;line-height: 1.5;color:#ffc627;color:#ffc627;font-size:20px;text-decoration: none;font-family: 'Roboto Slab';font-weight:400;display: inline-block;text-align: center;" href="#">Find Out Why</a></div> <span class="para"> <b>Mike Alkire</b>, Premier’s Chief Operating Officer, discusses <br> disruption in supply chain and what it means for you. </span> </td> </tr> <tr> <td height="30"></td> </tr> </table> </td> </tr> <!--third box--> <!-- yellow --> <td bgcolor="666666"height="3"></td> <tr style="background:url(http://offers.premierinc.com/rs/381-NBB-525/images/pattern.jpg) no-repeat 0px 0px; background-size:cover;" height="250" class="ban"> <td> <table border="0" width="600" align="center" cellpadding="0" cellspacing="0" class="container-middle"> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="mainContent"> <tr align="center"> <td style="padding:10px 0;"><span class="h-title" style="color:#333333;font-family:Arial;font-size:35px;font-weight:600;line-height:1em;text-align:center;text-decoration:none;">2018 Healthcare Trends </span></td> </tr> <tr> <td align="center" style="color:#333333; font-family:Arial;font-size:16px;margin-bottom: 15px;line-height:1.5em;" data-color="header small text" data-size="header small text" data-min="15" data-max="18"> <span class="para"> Premier Chief Executive Officer and President, Susan Devore<br> breaks down what to expect in 2018, and how to prepare for what’s next. </span> </td> </tr> </table> <div style="text-align: center;"> <a style="margin-top:25px;padding:5px 26px 5px 26px;background-color:#0091b3;border: 2px solid #ffffff;border-radius: 7px;line-height: 1.5;color:#ffc627;color:#ffffff;font-size:20px;text-decoration: none;font-family: 'Roboto Slab';font-weight:400;display: inline-block;text-align: center;" href="#">Learn More</a></div> </td> </tr> </tbody> </table> </td> </tr> <tr><td height="22"></td></tr> </table> </td> </tr><td bgcolor="666666"height="3"></td> <!-- second box--> <tr> <td bgcolor="ffffff"> <table width="600" border="0" align="center" cellpadding="0" cellspacing="0" class="mainContent"> <tr align="center"><img style="margin:0 auto;display:block;margin-top:25px;margin-bottom:15px;" src="http://offers.premierinc.com/rs/381-NBB-525/images/brk-18-logo_1.png" alt="LineItemDetails" height="69" width="350"> <td style="padding:10px 0;"><span class="h-title" style="color:#333333;font-family:Arial;font-size:30px;font-weight:600;line-height:1em;text-align:center;text-decoration:none;">Executive Leadership Track </span></td> </tr> <tr> <td align="center" style="color:#333333; font-family:Arial;font-size:16px;margin-bottom: 15px;line-height:1.5em;" data-color="header small text" data-size="header small text" data-min="15" data-max="18"> <span class="para"> Wednesday, June 20 and Thursday, June 21<br>Gaylord Opryland, Nashville, TN </span> </td> </tr> </table> <div style="text-align: center;"> <a style="margin-top:25px;margin-bottom:45px;padding:5px 26px 5px 26px;background-color:#transparent;border: 2px solid #ffc627;border-radius: 7px;line-height: 1.5;color:#ffc627;color:#ffc627;font-size:20px;text-decoration: none;font-family: 'Roboto Slab';font-weight:400;display: inline-block;text-align: center;" href="#">Register Now</a></div> </td> </tr> <!-- footer --> <tr> <td bgcolor="#3abac1"> <div id="footer"> <div id="logo"></div> <div class="social_icons"> <div id="twiterr_icon"></div> <div id="youtube_icon"></div> <div id="insta_icon"></div> <div id="linkedin_icon"></div> <div id="fb_icon"></div> </div> <!-- end social_icons --> </div> </td> </tr> <!-- footer --> </table> </td> </tr> </table> </body> </html>
... View more
‎Feb 12, 2018
07:03 AM
Awesome. Thank you that worked (of course). I was trying the same thing but goofed up on the media query. Have a good one.
... View more
‎Feb 10, 2018
02:49 PM
Fixed. I started from scratch. After searching for the original "okaynav" code I was able to replicate and use your lightbox code. That pesky js-navbar-menu was no where to be found. Now if i can make the MENU button yellow when viewed in the hamburger. Good learning experience though. untitled document
... View more
‎Feb 09, 2018
09:09 AM
OK. so just to clarify. I can't add multiple onclick's for each link right? Maybe I need to find another responsive menu and use your lightbox code.
... View more
‎Feb 09, 2018
06:13 AM
Thanks osgood! Yes I'm stressed and rushing. Thank you that worked. One thing though. How can I add links to other urls or multiple links in the menu? Since there is only one onclick script.
... View more
‎Feb 08, 2018
05:57 PM
Your gonna kill me man. I can't believe I missed it. The url was missing the // http:www. Dang! Sorry for all this. untitled document But now the hamburger is out of commission again. !!!!! Nevermind the js_menu script is missing. Won't bother you anymore. Getting on a bootstrap forum.
... View more
‎Feb 08, 2018
05:58 AM
Hey again, I just noticed that the 'hambuger' menu stopping workin throughout the editing. Would you have an idea of what happened? Here is a link to the same one with the hamburger menu that works. Ya, the form looks like junk because someone got in there and messed it up. just saying:) capital analyitics
... View more
‎Feb 08, 2018
05:54 AM
Thank you!!
... View more
‎Feb 07, 2018
05:47 PM
Hey osgood, Think I ruined something. My X to close the lightbox is missing or behind the header. Not sure how or what i did. untitled document It's showing up in my original lightbox http://offers.premierinc.com/header_lightbox.html​ [Edited by Mod]
... View more
‎Feb 07, 2018
01:13 PM
Perfecto! Thanks osgood! I've seen that before in my travels and now I know what it means. Think the header looks and works awesome. Thanks again you genius!
... View more
‎Feb 07, 2018
11:26 AM
That worked but it you look close you can see little black dots like it's not loading js.
... View more
‎Feb 07, 2018
10:27 AM
OK got it to work without the page-output code. For some reason it works on its own. Check out the link again. untitled document How can I get the learn more link to simply go to another url. I have a url in there but the link isn't working. Would this have to be the AJAX link code that Nancy was referring to? Not sure why it doesn't work.
... View more
‎Feb 07, 2018
07:29 AM
Ok thanks. I'm going to give this a shot. Yes I have access to the pages they are all local. I get what your saying. I think. Basically the link in the lightbox TOC page calls the named page (data-link) which loads the page into the site behind the lightbox and the lightbox closes. As far as the page-output <div> goes can I place that <div> around the whole page code or does it matter where it's placed? Have all the page content inside that div? If not it would load a page into a page? Or would all the other code be dismissed and just have that div load? Do you have any suggestion on how to get that dang link in the header to go to a page in the site (learn more).
... View more
‎Feb 06, 2018
01:21 PM
Awesome!!! Thanks osgood Works! I tried changing the width to 50% and the height to 500px. Works but only the page is scaled inside the lightbox leaving the lightbox container the original size. Any way to adjust that size too? Is it possible to have a link in the lightbox page open in the parent window and close the box? Also wondering how I would get the "learn More' link to open like a normal page link on a site. Nice work.
... View more
‎Feb 06, 2018
05:58 AM
Hey there Thanks for the reply. No I need the external webpage to open in a lightbox (MENU). Just like the working lightbox example. The other link "learn more" to go to another page inside the site like normal. The lightbox MENU is opening a table of contents where you can click a chapter and go to that page. Once you click a chapter the lightbox disappears and it goes to that URL in the parent window. I'm only using ION for specific assessments and ebook things. Once I have the header correct I can re-use the code. I am building landing pages and other mini sites that I would like to carry over the header outside of the ION platform.
... View more
‎Feb 05, 2018
05:44 PM
All the code is generated by them. There is nothing I can do about that I'm not messing with any of it. I just really need to get the lightbox feature working within my custom code block. I have total access to the code but I don't see that as an option.
... View more
‎Feb 05, 2018
05:06 PM
After I created the responsive menu styled to our branding I coudn't use their out of the box lightbox feature. If you go through the chapter you can see their version of the menu. lightbox feature that Im trying to replace. Hope that all makes sense.
... View more
‎Feb 05, 2018
04:55 PM
Actually it's built using ION interactive. My company is using the platform to quickly build pages/learning exercises but i can place custom code snippets which is what the header is. It's built in html and they can go from chapter to chapter with next buttons. I created the header and they wanted to charge us money to build a custom header and incorporate the lightbox feature. It has to be built using this platform we have no other choice ion interactive Content Marketing Solutions https://premierinc.postclickmarketing.com/erp-buying-guide
... View more
‎Feb 05, 2018
04:12 PM
Thanks Nancy. I tried below and it's not working on my page but works by itself? I tried this locally not on the link I sent to the header/menu. <a href="#" onclick="function()">Text</a> <div class="col-lg-9 col-md-9 col-sm-9 col-xs-6"> <nav role="navigation" class="okayNav pull-right" id="js-navbar-menu"> <ul id="navbar-nav" class="navbar-nav"> <li> <a style="color: #ffc627;" class="btn-nav" >877.777.1552</a></li> <li><a href="https://www.w3schools.com" onclick="function()">Text</a></li> <li><a style="margin-top:5px;padding:7px 15px 7px 15px;background-color:#transparent;border: 2px solid #e7e7e7;border-radius: 7px;line-height: 1.5;" class="btn-nav" href="#">MENU</a></li> </ul> </nav> </div>
... View more
‎Feb 05, 2018
02:27 PM
Thanks osgood. Thats right I used that youtube lightbox. That project dropped off and i forgot that you helped me with that. Your code is working but the lightbox is applied to all the links in the header not just the "menu". How would I be able to get "learn more" to open a url in the parent window not the lightbox? I cleaned up some of that code crap that wasn't being used. Thanks man!
... View more
‎Feb 05, 2018
12:21 PM
I need a lightbox to get around pop up block. basically it's acting like a table of contents for an ebook/website. I don't want it to be a pop up window.
... View more
‎Feb 05, 2018
11:18 AM
Hi Everyone, I'm having trouble figuring out how to add a lightbox feature to a mobile menu. I have the lightbox built and working on its own but can't figure how to incorporate it into my responsive menu without breaking everything. I'm not looking for anything fancy. Just a lightbox feature that can open a url. This is my menu: untitled document This is my lightbox: http://offers.premierinc.com/header_lightbox.html
... View more
‎Jan 30, 2018
10:11 AM
Perfect! Thanks a bunch. How can I get the buttons to center? They center with the media query under 600px.
... View more
‎Jan 30, 2018
08:30 AM
This is my css: <!-- flexbox--> <style> .flexcontainer { display:flex; flex-wrap:wrap; flex-direction:row; justify-content:flex-start; align-items:stretch; } .left {order:1; background-color:#0091b3; flex-basis:100%; height:300px;padding:35px;} .right {order:2; background-color:#7a979f;flex-basis:100%; height:300px;padding:35px;} @media screen and (min-width:600px) { .flexcontainer { flex-wrap:nowrap; } .left { flex-basis:50%; order:1; } .right { flex-basis:50%; order:2; } } </style> <!-- end flexbox--> This is my html: <div class="flexcontainer"> <div class="left"> <img style="margin:0 auto;display:block;width:80%;height: auto;margin-top:45px;" src="http://offers.premierinc.com/rs/381-NBB-525/images/pc-capitalanalytics_hires-white_720_con.png" alt="calogo" height="15" width="494"><p style="text-align:center; color: #ffc627;font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size: 38px; font-weight: 400;margin-bottom: 15px">FREE TRIAL</p><p style="text-align:center;font-family: 'Open Sans', Helvetica, Arial, sans-serif;font-size:20px;color:#b4c0c5;">vulputate vel, odio duis, qui vero, nulla suscipit qui in quis dignissim diam ullamcorper feugait, lorem. Ullamcorper adipiscing aliquip. Odio nulla et aliquam, quis facilisi.</p><a style="color: #ffc627; margin 0 auto;font-size:16px;font-weight:700;margin-top:-3px;padding:7px 15px 7px 15px;background-color:#transparent;border: 2px solid #ffc627;border-radius: 7px;line-height: 1.5;cursor: pointer;font-family: 'Open Sans', Helvetica, Arial, sans-serif;text-decoration:none;" href="#">FIND OUT HERE</a> </div> <div class="right"> <img style="margin:0 auto;display:block;margin-top:45px;margin-bottom:30px;" src="http://offers.premierinc.com/rs/381-NBB-525/images/hardhat_icon.png" alt="LineItemDetails" height="100" width="100"><p style="text-align:center; color: #ffc627;font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size: 38px; font-weight: 400;margin-bottom: 15px;line-height:1.25;">WHAT'S YOUR SOLUTION?</p><p style="text-align:center;font-family: 'Open Sans', Helvetica, Arial, sans-serif;font-size:20px;color:#b4c0c5;">vulputate vel, odio duis, qui vero, nulla suscipit qui in quis dignissim diam ullamcorper feugait, lorem. Ullamcorper adipiscing aliquip. Odio nulla et aliquam, quis facilisi.</p><a style="color: #ffc627; margin 0 auto;font-size:16px;font-weight:700;margin-top:-3px;padding:7px 15px 7px 15px;background-color:#transparent;border: 2px solid #ffc627;border-radius: 7px;line-height: 1.5;cursor: pointer;font-family: 'Open Sans', Helvetica, Arial, sans-serif;text-decoration:none;" href="#">FIND OUT HERE</a> </div> </div>
... View more
‎Jan 30, 2018
08:28 AM
OK. So took a shot at my first flexbox. Long over due. Got it to work. Kind of. Why would my content be dropping below and outside of the box? I can't get the buttons to center either. Would this be something to do with a wrap setting? This is what I'm looking at; capital analytics trial
... View more
‎Jan 29, 2018
02:23 PM
Thanks osgood! That was my next plan:)
... View more
‎Jan 29, 2018
01:59 PM
Hey Nancy, I got it work work. I tooled around in codepen. https://codepen.io/anon/pen/RQwYXX thanks again for your help.
... View more
‎Jan 29, 2018
01:45 PM
OK. Thanks Nancy. Would this enable them to stack on mobile if I refer to table-cell in only desktop query?
... View more
‎Jan 29, 2018
01:08 PM
Hi, I have a landing page I'm working on and am having trouble getting both responsive boxes to maintain equal height. One has more content than the other. How could I possibly get this to work? Here is a link to the page I'm working on: capital analytics trial Thanks for any help. UPDATE: I changed the boxes to display: table-cell; which worked but now they won't move on top of one another when sized to mobile
... View more
‎Nov 29, 2017
11:07 AM
Thank again
... View more
Copyright © 2025 Adobe. All rights reserved.
AdChoices