Icon in the Phone Info Section

Hi Yigit, please see attached for temporary login and phone icon I like to use. Thanks!

Oops gave you the wrong permissions. Please try again.

Sorry to be a pain. Could the icon be positioned to the right? Also, if it’s not too much to ask, what code was added and where? I would like to transfer it to my live website once the changes have been approved. Thanks!

The icon is making top bar stretch roughly 2px lengthwise. Because of this, the header is now overlapping the banner. Can I make the icon a tad bit smaller?

I’ve changed both the text and icon to 18px but there’s still a gap. :(

.phone-info { text-align: center; font-size: 18px; }

.phone-info .iconbox_icon {
    float: right;
    font-size: 18px;
    margin: 0;
    margin-left: 5px;
} 

I will post a mockup this week – please don’t close this thread yet. Thanks!

Please see attached for rough mock up. Regardless of the resolution/device, I would like the layout to be the same.

— Edit —
I would like the banner and content to adjust accordingly to have the same look regardless of resolution or device. Currently right now each monitor displays the webpage differently. For instance sometimes the content is only shown when you scroll down or sometimes it shows more of the lower half of the page. I hope that makes sense.

• This reply was modified 8 years, 10 months ago by schenkco.

Although this in theory answers my question but not exactly what I’m looking for. For instance the ratio is 3/4 banner and 1/4 content. Even on different screens, it will always be 3/4 banner and 1/4 content (unless too small where the mobile site kicks in). So the site has to be responsive. Perhaps I’m just asking for too much with this template.