Welcome to Code Forum!

Join a community that supports you and your coding journey from day one. We strive to be a friendly, supportive community that empowers everyone to be better developers. By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.

    GIF shows where to locate </> in the thread and or post editor toolbar.
    To learn more about how to use our BBCode feature, review our "How to post your code into threads" here.

    Thank you, Code Forum.

HTML Absolute positioning in Gmail

momo98

momo98

New Coder
Hello everyone,

I have a coding problem. I want to embed the following code in Gmail for my signature. However, the CSS function "position: absolute; " is not supported by Gmail.

Would you be able to reproduce the following code without using the value “position: absolute; and keeping the same desing ?

here it is :

HTML: 
<header id="separatorHeader" style="height: 15px;">
    <span style=" display: block; width: 100%; height: 100%; position: relative;">
        <span style="background-color: rgb(116, 116, 166); width: 100px ; left: 0px; position: absolute; height: 100%;"></span>
        <span style="background-color: rgb(116, 116, 166); width: 220px; left: 120px;position: absolute; height: 100%; "></span>
        <span style=" background-color: rgb(116, 116, 166); width: 140px; left: 360px; position: absolute; height: 100%; " ></span>
    </span>
</header>

I have tried without any good results, that's why i ask for help !

Thank you very much 🙂
 
Sort by date Sort by votes
momo98 said:
Hello everyone,

I have a coding problem. I want to embed the following code in Gmail for my signature. However, the CSS function "position: absolute; " is not supported by Gmail.

Would you be able to reproduce the following code without using the value “position: absolute; and keeping the same desing ?

here it is :

HTML: 
<header id="separatorHeader" style="height: 15px;">
    <span style=" display: block; width: 100%; height: 100%; position: relative;">
        <span style="background-color: rgb(116, 116, 166); width: 100px ; left: 0px; position: absolute; height: 100%;"></span>
        <span style="background-color: rgb(116, 116, 166); width: 220px; left: 120px;position: absolute; height: 100%; "></span>
        <span style=" background-color: rgb(116, 116, 166); width: 140px; left: 360px; position: absolute; height: 100%; " ></span>
    </span>
</header>

I have tried without any good results, that's why i ask for help !

Thank you very much 🙂
Click to expand...
I found this article that may help you a bit better. I know I have done it in the past, but I have created the email from scratch lol, I am assuming you are just wanting to insert your template into the signature area.

mashtips.com

How to Create HTML Signature in Gmail?

Are you designing an email signature for your business? You can prepare HTML signature for Gmail and here's how to make an email signature.
mashtips.com mashtips.com
 
Upvote 0 Downvote
Correct me if i am wrong and i am going back many years now but it was common practice to build emails and signatures in tables rather then CSS. It means different email clients would load them with little issues and it was a lot easier to put together 😀
 
Upvote 0 Downvote
Antero360 said:
J'ai trouvé cet article qui peut vous aider un peu mieux. Je sais que je l'ai fait dans le passé, mais j'ai créé l'e-mail à partir de zéro lol, je suppose que vous voulez juste insérer votre modèle dans la zone de signature.

mashtips.com

How to Create HTML Signature in Gmail?

Are you designing an email signature for your business? You can prepare HTML signature for Gmail and here's how to make an email signature.
mashtips.com mashtips.com
Click to expand...


Hello, Yes indeed I would like to keep the same design as this code. But I would like to integrate it into my Gmail signature. So I'm asking if it's possible to keep the same design without using "position:" in the code. Thank you for your reply !
 
Upvote 0 Downvote
Play Snayk 3+, higher dimensional snake game?
What you may want to try, and it's what I found researching into this, was to create the signature using HTML/CSS in an HTML document, then go to the file via your browser and copy the content, then paste it into the signature box. This still may not translate the position but would get you a step closer.
 
Upvote 0 Downvote

New Threads

Latest posts

Share this page

Buy us a coffee!

Buy me a coffee.
Code Academy Advertisement
DataCamp Advertisement

About Us

Code Forum is a community platform where coding enthusiasts can connect with other developers, engage in discussions, ask for help, and share their knowledge with a supportive community. It's a perfect place to improve your coding skills and to find a community of like-minded individuals who share your passion for coding.

Site links

Stay Connected

Back
Top Bottom