The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How do I code something like this?

View previous topic View next topic Go down

How do I code something like this?

Post by YAI Website on January 29th 2016, 9:45 pm

Technical Details


Forum version : #PunBB
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
Forum link : ( link is hidden, you must reply to see )

Description of problem

How do I code something like this picture into HTML and CSS?


YAI Website
New Member

Posts : 5
Reputation : 1
Language : English, HTML, CSS

http://help.forumotion.com/help

Back to top Go down

Re: How do I code something like this?

Post by SLGray on January 29th 2016, 9:49 pm

Please change the title of your topic to something that is related to your question/issue, so that other users will be able to find their question/issue using the search engine.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36648
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: How do I code something like this?

Post by YAI Website on January 29th 2016, 9:53 pm

What do you want me to change it to?

YAI Website
New Member

Posts : 5
Reputation : 1
Language : English, HTML, CSS

http://help.forumotion.com/help

Back to top Go down

Re: How do I code something like this?

Post by Genesis on January 29th 2016, 10:08 pm

Where do you want the image?

Genesis
Helper
Helper

Male Posts : 2331
Reputation : 322
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

Re: How do I code something like this?

Post by APE on January 29th 2016, 10:45 pm

Your forum link is our link you need to put your OWN link in your post Please edit your first post and add your own URL Not the help forums one.

Also there is no need to hide the link Wink




APE
Manager
Manager

Male Posts : 8615
Reputation : 748
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

Re: How do I code something like this?

Post by YAI Website on January 30th 2016, 7:37 am

It's not an image I want to post, I want to make the image into tables that way it is purely code. I have no clue of how to even start, I do; however, know about tables, but the curves and overlapping is what I am unsure of.

@APE wrote:Your forum link is our link you need to put your OWN link in your post Please edit your first post and add your own URL Not the help forums one.

Also there is no need to hide the link Wink

Sorry, my forum is still incomplete. I would rather not let anyone see it until I am done. Wink

YAI Website
New Member

Posts : 5
Reputation : 1
Language : English, HTML, CSS

http://help.forumotion.com/help

Back to top Go down

Re: How do I code something like this?

Post by Genesis on January 30th 2016, 3:42 pm

I am really confused on where you want the image.

Genesis
Helper
Helper

Male Posts : 2331
Reputation : 322
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

Re: How do I code something like this?

Post by SLGray on January 30th 2016, 7:38 pm

Could you post the link where you see this image?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36648
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: How do I code something like this?

Post by YAI Website on February 2nd 2016, 9:53 pm

I want to convert the image to html. Not actually put the picture on the webpage, but convert it to html with coding. Like how do I put the curves in it?

YAI Website
New Member

Posts : 5
Reputation : 1
Language : English, HTML, CSS

http://help.forumotion.com/help

Back to top Go down

Re: How do I code something like this?

Post by SLGray on February 3rd 2016, 3:52 am

Please change the title of your topic to something that is related to your question/issue, so that other users will be able to find their question/issue using the search engine.



When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36648
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: How do I code something like this?

Post by Ange Tuteur on February 3rd 2016, 5:11 pm

Hmm.. I'd say you're going to need an ingenious use of HTML and CSS, mostly the latter. If you want to make curved elements in CSS you'll need to use the border-radius property. Take a look at this table for example :

Text text text
Code:
[table style="height:100px;width:300px;color:#FFF;background:#8C5;border-radius:0 100px 3px 0;"][tr][td]Text text text[/td][/tr][/table]

However, with what you're asking it'll definitely require overlapping some elements with CSS positioning. If you need more information on this stuff, this topic should help.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Re: How do I code something like this?

Post by YAI Website on February 3rd 2016, 9:55 pm

@Ange Tuteur wrote:Hmm.. I'd say you're going to need an ingenious use of HTML and CSS, mostly the latter. If you want to make curved elements in CSS you'll need to use the border-radius property. Take a look at this table for example :

Text text text
Code:
[table style="height:100px;width:300px;color:#FFF;background:#8C5;border-radius:0 100px 3px 0;"][tr][td]Text text text[/td][/tr][/table]

However, with what you're asking it'll definitely require overlapping some elements with CSS positioning. If you need more information on this stuff, this topic should help.

Yes, this is exactly what I want. I am curious as to how to get started. Any guidance would be very helpful.


@SLGray wrote:Please change the title of your topic to something that is related to your question/issue, so that other users will be able to find their question/issue using the search engine.


Well, what do you want me to change it to?

YAI Website
New Member

Posts : 5
Reputation : 1
Language : English, HTML, CSS

http://help.forumotion.com/help

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum