Streaming live at 10am (PST)

Text next to image not scaling properly


#1

Hey there!
I am working on my first Webflow site-
I am having problems with the "Solutions" section and getting the text reading "Display" "Video" and "TV Radio & Print" next to the image with the computer and circle icons to line up with the icons in the image.. I have lined them up where I would like them to stay relative to the icons but as soon as the browser window size is changed, the text does not align correctly.

Any help would be appreciated!


Here is my public share link: https://preview.webflow.com/preview/sravani-s-trendy-site?preview=21495abac4c677b2e7ac3eb8e22cfe88


#2

Hey @sravani.anumolu The read only link you shared is not working.


#3

https://preview.webflow.com/preview/sravani-s-trendy-site?preview=02460263a34fe43047adf39bdc6083ab


#4

Hey @sravani.anumolu .

  1. The workaround for this is to set the parent div block Get Noticed Images to Position:Relative and the three Display, Video and TV texts to Position:Absolute
  2. Use pixel/unit-based text size (EMs, REMs, PX) as opposed to vw widths for better visibility. Make sure the text size and the line height are similar.
  3. Finally, Use percentages to position your text both vertically and horizontally. Fine tune this for the different device layouts to get as close an an accurate positioning as possible.

#5

Thanks so much @AlexManyeki
This worked for the images on the left but I can't get it work for images floated on the right- you'll see in my site that under that circle i have another one to the right side with an iphone!

Any idea how to do this? Need the "SEO" text to line up with the icon and so on


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.